Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
45aabd6b by renchao@pashanhoo.com
Options

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

2 parents 605060e2 f735de64
Inline Side-by-side
Showing 45 changed files with 1518 additions and 1873 deletions
import request from '@/utils/request'
import SERVER from './config'
const url = SERVER.LPBSERVERAPI + '/rest/zhcx/lpcx/'
/*
楼盘查询
*/
......@@ -17,7 +17,23 @@ export function getLpZrz (data) {
// 获取楼盘表
export function getLpb (zrzbsm) {
return request({
url: 'service-lpb/rest/zhcx/lpcx/getLpb?zrzbsm=' + zrzbsm,
url: url + 'getLpb?scyclx=1&zrzbsm=' + zrzbsm,
// url: 'service-lpb/rest/zhcx/lpcx/getLpb?zrzbsm=' + zrzbsm ,
method: 'get'
})
}
// 获取楼盘表房屋用途,房屋性质右侧房屋用途统计数据
export function getLpbFwytAndQlxz (zrzbsm) {
return request({
url: url + 'getLpbFwytAndQlxz?scyclx=1&zrzbsm=' + zrzbsm,
method: 'get'
})
}
// 获取楼盘表缺失项统计
export function getLpbQsxtj (zrzbsm) {
return request({
url: url + 'getLpbQsxtj?scyclx=1&zrzbsm=' + zrzbsm,
method: 'get'
})
}
......
......@@ -3,7 +3,7 @@
* @Autor: renchao
* @LastEditTime: 2023-03-02 13:25:48
*/
import dialogBox from '@/components/DialogBox/dialogBox.vue'
import dialogBox from '@/components/dialogBox/dialogBox.vue'
import LbTable from '@/components/LbTable/lb-table.vue'
import Theme from '@/components/Theme/theme.vue'
import Popup from '@/components/Popup/index'
......
......@@ -10,10 +10,10 @@
</router-link>
</scroll-pane>
<ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu">
<li @click="refreshSelectedTag(selectedTag)">Refresh</li>
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">Close</li>
<li @click="closeOthersTags">Close Others</li>
<li @click="closeAllTags(selectedTag)">Close All</li>
<li @click="refreshSelectedTag(selectedTag)">刷新</li>
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">关闭</li>
<li @click="closeOthersTags">关闭其他</li>
<li @click="closeAllTags(selectedTag)">关闭所有</li>
</ul>
</div>
</template>
......@@ -164,18 +164,17 @@ export default {
}
},
openMenu (tag, e) {
const menuMinWidth = 105
const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
const offsetWidth = this.$el.offsetWidth // container width
const maxLeft = offsetWidth - menuMinWidth // left boundary
const left = e.clientX - offsetLeft + 15 // 15: margin right
if (left > maxLeft) {
this.left = maxLeft
} else {
this.left = left
}
// const menuMinWidth = 105
// const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
// const offsetWidth = this.$el.offsetWidth // container width
// const maxLeft = offsetWidth - menuMinWidth // left boundary
// const left = e.clientX - offsetLeft + 15 // 15: margin right
// if (left > maxLeft) {
// this.left = maxLeft
// } else {
// this.left = left
// }
this.left = e.clientX
this.top = e.clientY
this.visible = true
this.selectedTag = tag
......
......@@ -369,4 +369,19 @@ aside {
.item-cwnr img {
height: 30px;
}
\ No newline at end of file
}
//楼盘表的幢/幢单元名称
.lpb-xmmc {
height: 60px;
line-height: 60px;
background-color: #ffffff;
border: 1px solid #e6e6e6;
text-align: center;
transition: 0.5s;
margin-left: -1px;
border-top: 0;
.el-checkbox__label {
font-size: 16px;
}
}
......
.tableDivCss {
width: 100%;
height: 100%;
background-color: #f5f5f5;
padding: 5px;
overflow-y: scroll;
}
.tableCss {
width: 100%;
background: #fff;
text-align: center;
border-collapse: collapse;
color: #333;
th {
border: 1px solid #e8e8e8;
line-height: 42px;
padding: 0 4px;
font-size: 14px;
}
td {
border: 1px solid #e8e8e8;
line-height: 42px;
padding: 0 4px;
font-size: 14px;
}
.title {
line-height: 68px;
font-size: 22px !important;
}
}
\ No newline at end of file
import { mapGetters } from 'vuex'
import { defaultParameters } from "../../views/ywbl/ywsq/javascript/publicDefaultPar";
export default {
data () {
return {
......@@ -39,6 +40,13 @@ export default {
let deleteAfterPage = Math.ceil((this.tableData.total - 1) / this.pageData.pageSize)
let currentPage = this.pageData.currentPage > deleteAfterPage ? deleteAfterPage : this.pageData.currentPage
this.pageData.currentPage = currentPage < 1 ? 1 : currentPage
},
resetForm(isYwbl){
if (isYwbl) {
this.queryForm = defaultParameters.defaultParameters();
this.pageData.currentPage = 1;
this.queryClick()
}
}
}
}
......
<template>
<div class="edit">
<el-tabs type="card" v-model="activeName" v-if="!isJump">
<el-tab-pane label="楼盘页面" name="first"></el-tab-pane>
<el-tab-pane label="单元列表页面" name="second"></el-tab-pane>
</el-tabs>
<!-- <div class="tab-header">
<el-row class="searchContent">
<el-col :span="24" style="margin:0 0 10px 18px;">
<el-radio-group v-model="scyclx" @change="scyclxChange">
<el-radio-button label="0">预测</el-radio-button>
<el-radio-button label="1">实测</el-radio-button>
</el-radio-group>
<el-input maxlength="28" v-model="" :style="{ width: inputWidth + 'px' }" class="searchInput"
placeholder="输入不动产单元号或室号"><i slot="suffix" class="el-input__icon el-icon-search" @click="inputChange"></i>
</el-input>
</el-col>
</el-row>
</div> -->
<el-tabs type="card" v-model="activeName" >
<el-tab-pane label="楼盘页面" name="first"></el-tab-pane>
<el-tab-pane label="单元列表页面" name="second"></el-tab-pane>
</el-tabs>
<div class="tab-content" v-if="activeName=='first'" ref="tabContent" :style="{ height: lpbContentHight + 'px' }" v-show="bjztFlag">
<!-- 楼盘表主体 -->
<div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }">
......@@ -53,7 +40,7 @@
<tr v-for="(item, index) in dyztList" :key="index" class="cp"
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
<i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -68,7 +55,7 @@
<tr v-for="(item, index) in fwxzList" :key="index" class="cp"
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
<i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -87,7 +74,7 @@
<tr v-for="(item, index) in fwytList" :key="index" class="cp"
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
<i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -105,7 +92,7 @@
</tr>
<tr v-for="(item, index) in qsxList" :key="index" class="cp" @click="handleChoosedH(item.bsms, item.color)">
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
<i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>0</td>
......@@ -125,6 +112,7 @@
<script>
import lpbContent from "./lpbContent/index";
import selectAllHInfo from "../ywbl/ywsq/components/selectAllHInfo"
import { getLpbFwytAndQlxz,getLpbQsxtj } from '@/api/lpb'
export default {
name: "lpb",
props: {
......@@ -222,58 +210,32 @@ export default {
//获取各项单元状态的户bsm
// this.getDyztBsmList();
//获取房屋用途统计数据
// this.getLpbFwytAndQlxz();
this.getLpbFwytAndQlxz();
// 楼盘表绘制区域宽度计算：楼盘表区域宽度-图例宽度34-滚动条宽度6
setTimeout(() => {
this.lpbContentwidth = ((document.documentElement.clientWidth || document.body.clientWidth) - 340) - 34 - 6;
}, 100);
},
methods: {
/* handleTabClick(event){
if(event.name=="first"){
this.$router.push({
path:"/lpb/index",
})
}else if(event.name=="second"){
this.$router.push({
path:"/ywbl/ywsq/components/selectAllHInfo",
})
}
},*/
loading () {
this.getLpbMenuTree(this.$store.state.zrzbsm);
},
lodding () {
this.getlpbData();
},
/* handleTabClick(event){
if(event.name=="first"){
this.$router.push({
path:"/lpb/index",
})
}else if(event.name=="second"){
this.$router.push({
path:"/ywbl/ywsq/components/selectAllHInfo",
})
}
},*/
//获取高度计算lpb内容区高度
getHeight () {
this.lpbContentHight = window.innerHeight - 190;
},
//图例的展开收起
legendToggle () {
this.legendToggleFlag = !this.legendToggleFlag;
},
//获取选中户bsm
getHbsm (data, type) {
if (type) {
// 双击
} else {
//单击 TO DO
this.bsms = data;
}
},
//调用楼盘表信息查询和图例统计接口
getlpbData () {
this.$refs.lpbContent.loadingData(this.$store.state.zrzbsm, this.scyclx);
this.getDyztBsmList();
this.getLpbFwytAndQlxz();
//改变楼盘表子组件的key值，重新渲染
// this.time = new Date().getTime();
},
//切换房屋状态
handleChoosedH (bsms, color) {
//每次切换房屋状态，将之前高亮的户边框颜色重置为默认
......@@ -291,13 +253,11 @@ export default {
this.$refs.lpbContent.borderColor = color;
})
},
//获取各项单元状态统计数据
getDyztBsmList () {
let data = {
zrzbsm: this.$store.state.zrzbsm,
scyclx: this.scyclx,
zrzbsm: 'ca71bcc498794a1e0ec3ac93869719f6',
scyclx: 1,
};
getLpbTj(data).then((res) => {
if (res.code === 200) {
......@@ -352,11 +312,7 @@ export default {
},
// 获取房屋用途和房屋性质及缺失项统计数据
getLpbFwytAndQlxz () {
let data = {
zrzbsm: this.$store.state.zrzbsm,
scyclx: this.scyclx,
};
getLpbFwytAndQlxz(data).then((res) => {
getLpbFwytAndQlxz('ca71bcc498794a1e0ec3ac93869719f6').then((res) => {
if (res.code === 200) {
// this.fwytList = res.result
this.fwytList = res.result.fwyt;
......@@ -375,32 +331,31 @@ export default {
}
}
});
getLpbQsxtj(data).then((res) => {
if (res.code === 200) {
this.qsxList = [
{
name: '坐落',
bsms: res.result.zl.bsms,
color: '#2591FD',
ts: res.result.zl.bsms.length
},
{
name: '分层分户图',
bsms: res.result.fcfht.bsms,
color: '#2591FD',
ts: res.result.fcfht.bsms.length
},
{
name: '室号',
bsms: res.result.shbw.bsms,
color: '#2591FD',
ts: res.result.shbw.bsms.length
}
]
}
});
// getLpbQsxtj('ca71bcc498794a1e0ec3ac93869719f6').then((res) => {
// if (res.code === 200) {
// this.qsxList = [
// {
// name: '坐落',
// bsms: res.result.zl.bsms,
// color: '#2591FD',
// ts: res.result.zl.bsms.length
// },
// {
// name: '分层分户图',
// bsms: res.result.fcfht.bsms,
// color: '#2591FD',
// ts: res.result.fcfht.bsms.length
// },
// {
// name: '室号',
// bsms: res.result.shbw.bsms,
// color: '#2591FD',
// ts: res.result.shbw.bsms.length
// }
// ]
// }
// });
}
},
computed: {},
destroyed () {
......@@ -425,60 +380,13 @@ export default {
.edit {
height: 100%;
background-color: #F4F9FF;
.tab-header {
border: 1px solid #dedede;
box-sizing: border-box;
padding: 20px 0;
background-color: #ffffff;
margin-bottom: 10px;
position: relative;
.searchContent {
margin-left: 62px;
box-sizing: border-box;
padding: 0 20px;
.searchInput {
transition: 0.5s;
margin-left: 20px;
display: inline-block;
}
}
.change {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 80px;
border-right: 1px solid #dedede;
i {
cursor: pointer;
color: #0090FF;
font-size: 36px;
display: inherit;
text-align: center;
line-height: 128px;
}
}
.radioBtn {
margin-left: 10px;
padding: 12px 10px;
border: 0;
i {
font-size: 13px;
padding-right: 4px;
}
/deep/.el-radio-button__inner {
border: 1px solid #dcdfe6;
border-radius: 4px;
box-shadow: 0 0 0 0 #409eff !important;
}
}
}
.tab-content {
border: 1px solid #dedede;
background-color: #ffffff;
display: flex;
&::-webkit-scrollbar {
width: 1px;
}
.lp-tree {
height: 100%;
overflow: hidden;
......@@ -489,15 +397,12 @@ export default {
float: left;
}
}
.w0 {
width: 0;
}
.w260 {
width: 260px;
}
.lp-overview {
transition: 0.5s;
flex: 1;
......@@ -507,17 +412,14 @@ export default {
margin-right: 10px;
box-sizing: border-box;
}
.lp-legend {
transition: 0.5s;
height: 100%;
font-size: 14px;
.handleCol {
width: 34px;
float: right;
height: 100%;
.btn {
cursor: pointer;
height: 40px;
......@@ -527,14 +429,12 @@ export default {
color: #fff;
border-bottom: 1px solid #e6e6e6;
}
.dyzt,
.fwxz,
.fwyt,
.qsx {
height: 122px;
}
.dyzt,
.fwxz,
.fwyt,
......@@ -566,7 +466,9 @@ export default {
.legendTable {
margin-top: -1px;
border-color: #e4ebf4 !important;
border-collapse: collapse;
border-spacing: 0;
tr {
height: 40px;
line-height: 40px;
......@@ -585,6 +487,15 @@ export default {
height: 40px;
text-align: center;
white-space: nowrap;
.circle{
display: inline-block;
width: 12px;
height: 12px;
border-radius: 6px;
margin-right: 2px;
position: relative;
top: 1px;
}
}
td:first-child {
......@@ -596,46 +507,5 @@ export default {
}
}
}
.tab-content::-webkit-scrollbar {
width: 1px;
}
.btnGroup {
margin: 20px auto 0;
width: 260px;
}
.hbjDialog {
/deep/ .el-dialog {
margin-top: 10vh !important;
}
}
.fa {
padding-right: 4px;
}
.wrap {
width: 100%;
height: 30px;
position: relative;
.main-button {
display: -webkit-flex;
display: flex;
flex-direction: column-reverse;
flex-wrap: nowrap;
position: absolute;
left: 165px;
top: 18px;
}
.download {
position: absolute;
left: 312px;
top: 19px;
}
}
}
</style>
......
<!--
* @Author: yangwei
* @Date: 2023-02-28 15:47:12
* @LastEditors: yangwei
* @LastEditTime: 2023-03-02 16:35:36
* @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ch.vue
* @Description:
*
* Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
-->
<template>
<div class="ch-wrap">
<table
class="chTable"
ref="ch"
border="1"
cellspacing="0"
cellpadding="0"
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)"
>
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
<td
v-for="(hs, hsIndex) in cs.hs"
:rowspan="hs.sjcs"
:colspan="hs.sjhs"
:data-bsm="hs.bsm"
:data-qszt="hs.qszt"
ref="hBsm"
:key="hsIndex"
style="border-color: rgb(230, 230, 230)"
:class="hs.select ? 'tdSelect' : ''"
@click="handleClickH($event.target, hs.bsm, hs)"
@dblclick="dbclick(hs.bsm)"
@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
>
<ul @click.stop="hDyztClick($event, hs.bsm, hs)" class="dyzt">
<li style="background-color: #6edee1" v-show="hs.qqzt == '1'">
确
</li>
<li style="background-color: #8adc88" v-show="hs.bazt == '1'">
备
</li>
<li style="background-color: #ff8282" v-show="hs.dyzt == '1'">
抵
</li>
<li style="background-color: #d7cecf" v-show="hs.cfzt == '1'">
查
</li>
<li style="background-color: #d4a3eb" v-show="hs.yyzt == '1'">
异
</li>
<li style="background-color: #a5a3fb" v-show="hs.xzzt == '1'">
限
</li>
</ul>
</td>
</tr>
</table>
</div>
</template>
<script>
export default {
name: "BdcdjWebCh",
inject: ["openMenu", "selectAll"],
props: {
ch: {
type: Array,
default: function () {
return [];
},
},
},
data() {
return {
//选中户bsm合集
hbsmList: [],
//选中层bsm合集
cbsmList: [],
//选中户qszt集合
hqsztList: [],
//区分单双击事件的定时器
time: null,
};
},
mounted() {},
methods: {
// 层选中事件
handleClickC(e, item) {
//判断点击的层是否选中
if (e.target.className.indexOf("tdSelect") == -1) {
//未选中→选中
e.target.className += " tdSelect"; //加边框
this.cbsmList.push(item.bsm);
} else {
//选中→未选中
e.target.className = "floor";
this.cbsmList = this.cbsmList.filter((i) => i != item.bsm);
}
// this.$parent.getCbsm(this.cbsmList);
},
//户单击事件
handleClickH(e, bsm, hs) {
let self = this;
// 开启延时器，200ms的间隔区分单击和双击，解决双击时执行两次单击事件
clearTimeout(self.time);
self.time = setTimeout(() => {
// this.closeMenu();
//判断点击的户是否选中
if (!hs.select) {
//未选中→选中
hs.select = true; //加边框
this.hbsmList.push(bsm); // 将户bsm放进hbsmList
this.hqsztList.push(hs.qszt); // 将户qszt放进hqsztList
} else {
//选中→未选中
hs.select = false;
this.hbsmList = this.hbsmList.filter((i) => i != bsm);
this.hqsztList = this.hqsztList.filter((i) => i != hs.qszt);
}
}, 200);
},
// 户单元状态点击事件
hDyztClick(e, bsm, hs) {
this.handleClickH(e.target.parentNode, bsm, hs);
},
//户双击事件
dbclick(bsm) {
clearTimeout(this.time);
},
//幢单元全选/反选
zdySelectAll(val) {
this.ch.forEach((c) => {
c.hs.forEach((h) => {
if (val) {
h.select = true;
// 使用hbsmList时，需要去重
this.hbsmList.push(h.bsm)
} else {
h.select = false;
this.hbsmList = []
}
});
});
},
},
watch: {
selectAll: {
handler(val) {
this.zdySelectAll(val.selectAll);
},
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 {
td {
min-width: 138px;
height: 72px;
line-height: 72px;
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: 8px;
}
.lin {
color: #f7b500;
border-color: #f7b500;
}
.zheng {
color: #1ad6e1;
border-color: #1ad6e1;
}
.xian {
color: #45aefd;
border-color: #45aefd;
}
.dyzt {
user-select: none;
width: 138px;
height: 18px;
position: absolute;
bottom: 32px;
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 #006cff !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>
<template>
<div class="lpbContent-wrap" ref="lpbContentWrap">
<div class="lpbContent" ref="lpbContent">
<div :class="
lpbData.cs.length == 0 && lpbData.zdys.length == 0
? 'bottom40 ljz-wrap'
: 'ljz-wrap'
" :style="{ 'width': ljzWidth + 'px' }" v-show="lpbData.ljzs.length > 0">
<!-- 循环逻辑幢数据 -->
<div class="ljz" ref="ljz" v-for="(ljzs, ljzIndex) in lpbData.ljzs" :key="ljzIndex">
<!-- :class="[{ 'mt30': ljzIndex == 0 }, { 'mt60': ljzIndex == 1 || lpbData.ljzs.length == 1 }]" -->
<!-- :style="{'marginTop':ljzs.zdys.length>0?'0':'30px'}" -->
<!-- 循环逻辑幢下的幢单元 -->
<div class="ljz-zdy-wrap" :style="{ 'marginTop': ljzs.zdys.length > 0 ? '0' : '30px' }">
<div class="ljz-zdy column-reverse"
:style="{ 'min-height': ljzzdyHeight + 'px', 'marginRight': zdyIndex < (ljzs.zdys.length - 1) || ljzs.cs.length > 1 ? '20px' : '0' }"
ref="ljzzdy" v-show="ljzs.zdys.length > 0" v-for="(zdys, zdyIndex) in ljzs.zdys" :key="zdyIndex">
<!-- 幢单元名称 -->
<div class="zdy-name name">
<p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')">
<el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox>
</p>
</div>
<!-- 循环幢单元下的层户 -->
<!-- <div class="chTable-wrap"> -->
<table class="chTable psr" border="0" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0">
<tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex">
<!-- 显示层数 -->
<td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
@click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
<td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
:data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
:class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
@click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
@contextmenu.prevent="openMenu($event, hs, 'h')">
{{ hs.shbw }}
<span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
<span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
<span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
<ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
<li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
<li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
<li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
<li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
<li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
<li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
</ul>
</td>
</tr>
</table>
<!-- </div> -->
</div>
</div>
<!-- 循环逻辑幢下的层户 -->
<div class="ljz-ch" ref="ljzDlch"
:style="{ height: 'auto', marginTop: (ljzs.zdys.length > 0 ? '39' : 0) + 'px' }" v-if="ljzs.cs.length > 0">
<table class="chTable prs" :style="{
top:
ljzzdyHeight + 40 - ljzs.cs.length * 65 < 0
? 0
: ljzzdyHeight + 40 - ljzs.cs.length * 65 + 'px',
}" border="1" cellspacing="0" cellpadding="0">
<tr v-for="cs in ljzs.cs" :key="cs.bsm">
<!-- 显示层数 -->
<td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
@click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
<td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
:data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
:class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
@click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
@contextmenu.prevent="openMenu($event, hs, 'h')">
{{ hs.shbw }}
<span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
<span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
<span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
<ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
<li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
<li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
<li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
<li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
<li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
<li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
</ul>
</td>
</tr>
</table>
</div>
<!-- 逻辑幢名称 -->
<div class="ljz-name name">
<p class="cp" @dblclick="openZxx(ljzs.bsm, 'ljz')">
{{ ljzs.ljzmc }}
</p>
</div>
</div>
</div>
<div class="zdy-wrap"
:style="{ width: zdyWidth + 'px', marginTop: (lpbData.zdys.length > 0 || lpbData.cs.length > 0) ? '30px' : '0' }">
<!-- 循环自然幢下的幢单元 -->
<div class="zdy column-reverse" ref="zdy" v-for="(zdys, zdyIndex) in lpbData.zdys" :key="zdyIndex"
:style="{ 'min-height': zdyHeight + 'px' }">
<!-- 幢单元名称 -->
<div class="zdy-name name">
<p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')">
<el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox>
</p>
</div>
<!-- 循环幢单元下的层户 -->
<table class="chTable" border="1" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0">
<tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex">
<!-- 显示层数 -->
<td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
@click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
<td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
:data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
:class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
@click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
@contextmenu.prevent="openMenu($event, hs, 'h')">
{{ hs.shbw }}
<span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
<span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
<span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
<ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
<li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
<li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
<li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
<li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
<li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
<li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
</ul>
</td>
</tr>
</table>
</div>
<!-- 循环自然幢下的独立层户 -->
<!-- <template > -->
<div class="zdy column-reverse" ref="zrzDlch" :style="{ 'min-height': cHeight + 'px' }">
<table class="chTable" ref="ch" border="1" cellspacing="0" cellpadding="0"
v-show="lpbData.cs != null && lpbData.cs.length > 0">
<tr v-for="(cs, csIndex) in lpbData.cs" :key="csIndex">
<!-- 显示层数 -->
<td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
@click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
{{ cs.sjc }}层
</td>
<!-- 显示户 -->
<td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
:data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
:class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
@click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
@contextmenu.prevent="openMenu($event, hs, 'h')">
{{ hs.shbw }}
<span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
<span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
<span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
<ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
<li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
<li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
<li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
<li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
<li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
<li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
</ul>
</td>
</tr>
</table>
</div>
</div>
<!-- 层户 -->
<div class="zrz" :style="{ width: lpbContentWidth + 'px' }">
<el-checkbox v-model="zrzChecked" @change='lpbSelectAll'>{{ lpbData.xmmc }}</el-checkbox>
</div>
</div>
<!-- 双击户的弹出框 -->
<el-dialog :close-on-click-modal="false" title="户编辑" class="hbjDialog" :visible.sync="hbjVisible" width="80%">
<hbj ref="hbj" :bsm="hbsm" :scyclx="scyclx" :lpbParent="lpbParent"></hbj>
</el-dialog>
</div>
<div class="lpbContent-wrap" ref="lpbContentWrap">
<div class="lpbContent">
<!-- 纵向倒序排列 逻辑幢位于独立幢单元和独立层户的上方 -->
<div class="ch-zdy-wrap">
<!-- 幢单元 -->
<zdy-cpn v-if="lpbData.zdys.length" :zdys="lpbData.zdys" />
<!-- 独立层户 -->
<ch-cpn v-if="lpbData.cs.length" :ch="lpbData.cs" />
</div>
<!-- 逻辑幢 -->
<ljzs-cpn v-if="lpbData.ljzs.length" :ljzs="lpbData.ljzs" />
</div>
<!-- 自然幢名称 -->
<p class="lpb-xmmc">
<el-checkbox @change="zdySelectAll($event)">{{
lpbData.xmmc
}}</el-checkbox>
</p>
<!-- 右键菜单 -->
<ul
v-show="lpbChVisible"
:style="{ left: lpbChLeft + 'px', top: lpbChTop + 'px' }"
class="contextmenu"
>
<li @click="menuClick">菜单一</li>
<li @click="menuClick">菜单二</li>
</ul>
</div>
</template>
<script>
import { getLpb } from '@/api/lpb'
import { getLpb } from "@/api/lpb";
import chCpn from "./ch.vue";
import zdyCpn from "./zdys.vue";
import ljzsCpn from "./ljzs.vue";
export default {
name: "",
components: { },
props: {
zrzbsm: {
type: String,
default: ''
},
lpbParent: {
type: String,
default: 'isLpb'
},
isHb: {
type: Boolean,
default: true
},
},
data () {
return {
lpbData: {
ljzs: [],
cs: [],
zdys: [],
},
hbjVisible: false,
lpbContentWidth: 0,
ljzWidth: 10000,
zdyWidth: 1000,
cHeight: 0, //独立层户的div高度
zdyHeight: 0, //独立幢单元的div高度
ljzcHeight: 0, //逻辑幢下层户的div高度
ljzzdyHeight: 0, //逻辑幢下幢单元的div高度
loading: true,
hbsm: '',
hbsmList: [],
hqsztList: [],
cbsmList: [],
time: null, //区分单双击事件的定时器
searchNum: Math.random(),
//接收父组件传入的根据单元状态/房屋性质/房屋用途筛选的户bsmList
choosedList: [],
borderColor: "#E6E6E6",
lpbChVisible: false, //层户右键菜单显隐
lpbChLeft: 100,
lpbChTop: 100,
//右键层户数据
chData: "",
rightClickFlag: "",
formLabelWidth: "120px",
yclpbData: {},
sclpbData: {},
zrzChecked: false, //自然幢全选
};
},
mounted () {
this.getLpb(this.zrzbsm ? this.zrzbsm : '9434bdb243ba342cc6c043065fc9e480');
setTimeout(() => {
//让滚动条滚动至最下面 -6是横向滚动条的高度
this.$refs.lpbContent.scrollTop =
this.$refs.lpbContent.scrollHeight -
this.$refs.lpbContent.clientHeight -
6;
}, 200);
window.lpbContent = this;
},
methods: {
loadingData (zrzbsm, scyclx) {
this.getLpb(zrzbsm, scyclx, true);
},
//获取楼盘表数据
getLpb (zrzbsm, scyclx, actual) {
getLpb(zrzbsm, scyclx).then((res) => {
if (res.code == 200) {
res.result.ljzs = res.result.ljzs
.sort(this.compare("place"))
.reverse();
this.lpbData = res.result == null ? this.lpbData : res.result;
this.$nextTick(() => {
//渲染楼盘表
this.dataChange();
});
} else {
this.$message({
message: res.message,
type: "warning",
});
}
});
},
compare (property) {
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
};
},
//按照bdcdyh或shbw筛选户
lpbDataMap (sh) {
this.searchNum = sh;
if (this.hbsmList.length > 0) {
//清除之前选中户
this.clearChoosedH();
}
// console.log("查询searchNum" + searchNum);
},
//自然幢下元素高度宽度计算
dataChange () {
//计算逻辑幢宽度 20为marginRight值
this.ljzWidth = 0;
if (this.$refs.ljzzdy != undefined) {
this.$refs.ljzzdy.forEach((item) => {
this.ljzWidth += item.offsetWidth + 20;
});
if (this.$refs.ljzDlch != undefined) {
this.$refs.ljzDlch.forEach((item) => {
this.ljzWidth += item.offsetWidth;
});
}
} else {
if (this.$refs.ljzDlch != undefined) {
this.$refs.ljzDlch.forEach((item) => {
this.ljzWidth += item.offsetWidth + 20;
});
}
}
//计算独立幢单元和独立层户宽度
//考虑this.$refs.zdy的length为0的情况，即自然幢下没有独立幢单元
if (this.$refs.zdy != undefined && this.$refs.zdy.length > 0) {
//判断自然幢下有没有比层户高的幢单元
let higher = true;
//记录最高的幢单元高度 默认为第一个幢单元高度
let highest = this.$refs.zdy[0].offsetHeight;
this.zdyWidth = 20;
this.$refs.zdy.forEach((item) => {
this.zdyWidth += item.offsetWidth + 21;
this.cHeight =
item.offsetHeight > this.cHeight ? item.offsetHeight : this.cHeight;
highest = highest > item.offsetHeight ? highest : item.offsetHeight;
});
//判断有无独立层户
if (this.$refs.ch != undefined) {
//计算自然幢下的幢单元高度，如果有比层户高的幢单元，则幢单元高度设为最高的幢单元高度，如果没有，则设为层户高度
higher = highest > this.$refs.ch.offsetHeight ? true : false;
this.zdyHeight = higher ? highest : this.$refs.ch.offsetHeight;
highest = 0;
this.zdyWidth += this.$refs.ch.offsetWidth;
} else {
this.zdyHeight = highest;
highest = 0;
}
} else {
//有且仅有独立层户
if (this.$refs.zrzDlch != undefined) {
this.zdyWidth = this.$refs.zrzDlch.offsetWidth + 20;
}
}
//计算逻辑幢下的幢单元和层户的高度
this.ljzzdyHeight = 0;
if (this.$refs.ljzzdy != undefined && this.$refs.ljzzdy.length > 0) {
//判断自然幢下有没有比层户高的幢单元
let higher = true;
let zrzhighest = 0;
//记录最高的幢单元高度 默认为第一个幢单元高度
zrzhighest = this.$refs.ljzzdy[0].offsetHeight;
this.$refs.ljzzdy.forEach((item) => {
this.ljzcHeight = item.offsetHeight > this.ljzcHeight ? item.offsetHeight : this.ljzcHeight;
zrzhighest = zrzhighest > item.offsetHeight ? zrzhighest : item.offsetHeight;
});
//判断有无独立层户
if (this.$refs.ljzch != undefined) {
//计算自然幢下的幢单元高度，如果有比层户高的幢单元，则幢单元高度设为最高的幢单元高度，如果没有，则设为层户高度
higher = zrzhighest > this.$refs.ljzch.offsetHeight ? true : false;
this.$nextTick(() => {
this.ljzzdyHeight = higher ? zrzhighest : this.$refs.ljzch.offsetHeight;
zrzhighest = 0;
});
} else {
this.$nextTick(() => {
this.ljzzdyHeight = zrzhighest;
zrzhighest = 0;
});
}
} else {
}
this.$nextTick(() => {
this.lpbContentWidth = this.zdyWidth > this.ljzWidth ? this.zdyWidth - 20 : this.ljzWidth - 20;
if (this.lpbContentWidth == 0) {
//his.lpbContentWidth = this.$refs.lpbContent.offsetWidth
}
})
},
//户单击事件
handleTdClick (e, bsm, hs) {
let self = this;
// 开启延时器，200ms的间隔区分单击和双击，解决双击时执行两次单击事件
clearTimeout(self.time);
self.time = setTimeout(() => {
this.closeMenu()
//判断点击的户是否选中
if (e.className.indexOf("tdSelect") == -1) {
//未选中→选中
e.className = "tdSelect"; //加边框
this.hbsmList.push(bsm); // 将户bsm放进hbsmList
this.hqsztList.push(hs.qszt); // 将户qszt放进hqsztList
switch (this.lpbParent) {
case 'isHbfg':
self.fghbChoosedList.push(hs);
break;
case 'isFwsxbg':
break;
case 'isCxlz':
break;
case 'isLpb':
break;
default:
break;
}
} else {
//选中→未选中
e.className = "";
this.hbsmList = this.hbsmList.filter(i => i != bsm);
this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
switch (this.lpbParent) {
case 'isHbfg':
self.fghbChoosedList = self.fghbChoosedList.filter(i => i != hs)
break;
case 'isFwsxbg':
break;
case 'isCxlz':
break;
case 'isLpb':
this.hbsmList = this.hbsmList.filter(i => i != bsm);
this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
this.$parent.getHbsm(this.hbsmList, false);
this.$parent.getQsztList(this.hqsztList, false);
break;
default:
break;
}
}
}, 200);
},
//户双击事件
dbclick (bsm) {
clearTimeout(this.time);
this.hbsm = bsm;
this.$store.state.hbsm = bsm;
this.hbjVisible = true;
this.$nextTick(function () {
this.$refs.hbj.$refs.hbj.getHInfo(this.hbsm);
});
},
//删除多重数组中的某一项
deleteArrOption (arr, item) {
for (var i = arr.length; i > 0; i--) {
if (arr[i - 1] == item) {
arr.splice(i - 1, 1);
}
}
},
//清除选中户
clearChoosedH () {
// this.$nextTick(() => {
//将每个选中的户的选中状态清除
this.$refs.hBsm.forEach((item) => {
if (item.className == "tdSelect") {
item.className = "";
}
});
// 清空hbsmList
this.hbsmList = [];
this.hqsztList = [];
// });
},
//户右键点击事件
openMenu (e, item, type) {
this.lpbChLeft = e.pageX;
this.lpbChTop = e.pageY;
this.chData = item;
switch (this.lpbParent) {
case 'isHbfg':
break;
case 'isFwsxbg':
break;
case 'isCxlz':
break;
case 'isLpb':
this.rightClickFlag = type;
this.lpbChVisible = true;
break;
default:
break;
}
},
// 户单元状态点击事件
hDyztClick (e, bsm, hs) {
this.handleTdClick(e.target.parentNode, bsm, hs);
},
// 层选中事件
handleClickC (e, item) {
if (this.lpbParent == 'isLpb') {
//判断点击的层是否选中
if (e.target.className.indexOf("tdSelect") == -1) {
//未选中→选中
e.target.className += " tdSelect"; //加边框
this.cbsmList.push(item.bsm);
} else {
//选中→未选中
e.target.className = "floor";
this.deleteArrOption(this.cbsmList, item.bsm);
}
this.$parent.getCbsm(this.cbsmList);
} else {
}
},
//关闭右键菜单
closeMenu () {
this.lpbChVisible = false;
},
//end
//楼盘表户全选
lpbSelectAll (val) {
if (val) {
this.$refs.hBsm.forEach((item) => {
item.className = "tdSelect";
this.hbsmList.push(item.dataset.bsm); // 将户bsm放进hbsmList
this.hqsztList.push(item.dataset.qszt)
});
} else {
this.$refs.hBsm.forEach((item) => {
item.className = "";
this.hbsmList = [];
this.hqsztList = [];
});
}
this.$nextTick(() => {
this.$parent.getHbsm(this.hbsmList, false);
this.$parent.getQsztList(this.hqsztList, false);
})
},
//幢单元全选
zdySelectAll (val, cs) {
let zdyHbsmList = [];
let zdyHqsztList = [];
cs.forEach(i => {
i.hs.forEach(j => {
zdyHbsmList.push(j.bsm)
zdyHqsztList.push(j.qszt)
})
});
if (val) {
this.$nextTick(() => {
this.$refs.hBsm.forEach((item) => {
if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
item.className = "tdSelect";
}
});
this.hbsmList = this.hbsmList.concat(zdyHbsmList);
this.hqsztList = this.hqsztList.concat(zdyHqsztList);
})
} else {
this.$refs.hBsm.forEach((item) => {
console.log(item.dataset.bsm);
if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
item.className = "";
}
zdyHbsmList.forEach(j => {
if (item.dataset.bsm == j) {
this.hbsmList = this.hbsmList.filter(i => i != j)
}
})
zdyHqsztList.forEach(j => {
if (item.dataset.qszt == j) {
this.hqsztList = this.hqsztList.filter(i => i != j)
}
})
});
}
this.$nextTick(() => {
this.$parent.getHbsm(this.hbsmList, false);
this.$parent.getQsztList(this.hqsztList, false);
})
},
//逻辑幢、幢单元、层双击
openZxx (bsm, type) {
if (this.lpbParent == 'isLpb') {
this.$parent.taskTitle = '编辑';
this.$parent.dialogVisible = true;
this.$parent.curBsm = bsm;
this.$parent.menuType = type;
}
}
},
computed: {
createFlagChange () {
return this.$parent.createFlag;
},
legendToggleFlagChange () {
return this.$parent.legendToggleFlag;
},
scyclx () {
return this.$parent.scyclx;
},
},
watch: {
scyclx (n) {
this.hqsztList = [];
// this.getLpb(this.$store.state.zrzbsm, n);
if (n == '0') {
this.lpbData = this.yclpbData;
} else {
this.lpbData = this.sclpbData;
}
},
//监听有无通过输入框查询选择到的户,如果有，将其bsm放入hbsmList
searchNum (n) {
// 渲染查询到的户
this.$nextTick(() => {
this.$refs.hBsm.forEach((item) => {
if (item.className == "tdSelect") {
// console.log(item.offsetLeft,'offsetLeft');
// console.log(item.offsetTop,'offsetHeight');
//定位到最后一个户所在位置
this.$refs.lpbContent.scrollTop = item.offsetTop;
this.$refs.lpbContent.scrollLeft = item.offsetLeft;
console.log(item.dataset.bsm, "item.dataset.bsm");
// 判断hbsmList中是否已经存在
if (this.hbsmList.indexOf(item.dataset.bsm) == -1) {
this.hbsmList.push(item.dataset.bsm);
this.hqsztList.push(item.dataset.qszt);
}
}
});
});
},
//父组件中选择单元状态改变选中户的边框颜色
choosedList (n) {
if (n.length > 0) {
this.$refs.hBsm.forEach((item) => {
this.choosedList.forEach((i, ind) => {
if (item.dataset.bsm == i) {
if (ind == 0) {
//定位到第一个户所在位置
this.$refs.lpbContent.scrollTop = item.offsetTop;
this.$refs.lpbContent.scrollLeft = item.offsetLeft;
}
item.style.border = '1px solid ' + this.borderColor;
item.className = "tdSelect"
}
});
});
}
},
lpbChVisible (value) {
if (value) {
document.body.addEventListener("click", this.closeMenu);
} else {
document.body.removeEventListener("click", this.closeMenu);
}
},
},
provide() {
return {
openMenu: this.openMenu,
selectAll: this.selectAllObj,
};
},
name: "",
components: { chCpn, zdyCpn, ljzsCpn },
props: {
zrzbsm: {
type: String,
default: "",
},
lpbParent: {
type: String,
default: "isLpb",
},
isHb: {
type: Boolean,
default: true,
},
},
data() {
return {
lpbData: {
ljzs: [],
cs: [],
zdys: [],
},
//户全选标识 由于依赖注入的绑定并不是可响应的,所以传入可监听的对象以获取其属性的响应
selectAllObj: {
selectAll: false,
},
//层户右键菜单显隐
lpbChVisible: false,
//右键菜单定位位置
lpbChLeft: 100,
lpbChTop: 100,
};
},
mounted() {
this.getLpb("dfc08a0cc6a25188990ea53d1d2c500e");
// setTimeout(() => {
// //让滚动条滚动至最下面 -6是横向滚动条的高度
// this.$refs.lpbContent.scrollTop =
// this.$refs.lpbContent.scrollHeight -
// this.$refs.lpbContent.clientHeight -
// 6;
// }, 200);
// window.lpbContent = this;
},
methods: {
//全选户
zdySelectAll(val) {
this.selectAllObj.selectAll = val;
},
//获取楼盘表数据
getLpb(zrzbsm, scyclx, actual) {
getLpb(zrzbsm, scyclx).then((res) => {
if (res.code == 200) {
res.result.ljzs = res.result.ljzs.sort(this.compare("place"));
this.lpbData = res.result == null ? this.lpbData : res.result;
// this.$nextTick(() => {
// //渲染楼盘表
// this.dataChange();
// });
console.log(this.lpbData, "this.lpbData");
} else {
this.$message({
message: res.message,
type: "warning",
});
}
});
},
//户右键点击事件
openMenu(e, item, type) {
this.lpbChLeft = e.pageX - 96;
this.lpbChTop = e.pageY - 23;
this.lpbChVisible = true;
},
//关闭户右键菜单
closeMenu() {
this.lpbChVisible = false;
},
//右键菜单点击
menuClick() {
this.closeMenu();
},
compare(property) {
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
};
},
},
watch: {
//户右键菜单显示时，监听到鼠标点击时关闭户右键菜单
lpbChVisible(value) {
if (value) {
document.body.addEventListener("click", this.closeMenu);
} else {
document.body.removeEventListener("click", this.closeMenu);
}
},
},
};
</script>
<style scoped lang="scss">
.lpbContent-wrap {
width: 100%;
height: 100%;
overflow: hidden;
.lpbContent {
width: 100%;
height: 100%;
position: relative;
overflow: scroll;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
.ljz-wrap {
height: auto;
overflow: hidden;
.ljz {
display: table;
// margin-top: 30px;
.ljz-zdy-wrap {
width: auto;
display: table;
float: left;
.ljz-zdy {
height: auto;
float: left;
position: relative;
table {
bottom: 40px;
}
.zdy-name {
width: 100%;
// bottom: 0;
// position: absolute;
height: 40px;
// background-color: rosybrown;
// border:1px solid #E6E6E6
}
// .chTable-wrap{
// position: absolute;
// bottom: 40px;
// }
}
}
div:last-child {
margin-right: 0;
}
.ljz-ch {
float: left;
}
.ljz-zdy:last-child {
margin-right: 0;
}
.column-reverse {
display: flex;
flex-direction: column-reverse;
}
// }
.ljz-name {
width: calc(100% - 32px);
height: 40px;
// background-color: darkorange;
}
}
.mt30 {
margin-top: 30px;
}
.mt60 {
margin-top: 60px;
}
div:last-child {
margin-right: 0;
}
}
.zdy-wrap {
height: auto;
overflow: hidden;
// margin-top: 30px;
.zdy {
float: left;
margin-right: 20px;
.zdy-zdy-wrap {
.zdy-zdy {
height: auto;
margin-right: 20px;
display: inline-table;
.zdy-name {
bottom: 0;
// background-color: blanchedalmond;
// border:1px solid #E6E6E6
}
}
.zdy-zdy:last-child {
margin-right: 0;
}
}
.zdy-name {
width: calc;
height: 40px;
// background-color: rosybrown;
border: 1px solid #E6E6E6
}
}
.column-reverse {
display: flex;
flex-direction: column-reverse;
}
}
// 公共部分样式 start
.chTable {
margin-left: -1px;
// position: relative;
tr {
.floor {
background-color: #fff;
}
td {
min-width: 138px;
height: 72px;
line-height: 72px;
text-align: center;
cursor: pointer;
position: relative;
border: 1px solid #d5d6da;
.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: 8px;
}
.lin {
color: #F7B500;
border-color: #F7B500;
}
.zheng {
color: #1AD6E1;
border-color: #1AD6E1;
}
.xian {
color: #45AEFD;
border-color: #45AEFD;
}
.dyzt {
user-select: none;
width: 138px;
height: 18px;
position: absolute;
// background: orange;
bottom: 32px;
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 #006cff !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;
}
}
}
.name {
line-height: 40px;
text-align: center;
display: table-footer-group;
p {
width: calc(100% - 2px);
height: 100%;
// border: 1px solid #E6E6E6;
}
}
// end
}
.column-reverse {
display: flex;
flex-direction: column-reverse;
}
.zrz {
height: 60px;
line-height: 60px;
background-color: #ffffff;
border: 1px solid #E6E6E6;
// position: relative;
// bottom: 66px;
text-align: center;
transition: 0.5s;
}
.cantHb {
opacity: .5;
cursor: not-allowed;
}
.btnGroup {
margin: 20px auto 0;
width: 150px;
}
.el-checkbox {
font-size: 16px;
/deep/.el-checkbox__label {
font-size: 16px;
}
/deep/ .el-checkbox__inner {
width: 16px;
height: 16px;
}
/deep/ .el-checkbox__inner::after {
height: 9px;
left: 4px;
top: 0px;
width: 5px;
}
/deep/ .el-checkbox__input {
top: 1px;
}
}
.hbjDialog {
/deep/.el-dialog {
margin-top: 10vh !important;
}
}
width: 100%;
height: 100%;
overflow: hidden;
.lpbContent {
width: 100%;
height: calc(100% - 62px);
position: relative;
overflow: scroll;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
display: flex;
flex-direction: column-reverse;
box-sizing: border-box;
padding-top: 20px;
.ch-zdy-wrap {
display: flex;
flex-direction: row;
}
}
.lpb-xmmc {
border: 0;
border-top: 1px solid #e6e6e6;
}
// 自定义右键菜单样式
.contextmenu {
margin: 0;
background: #fff;
width: 92px;
z-index: 3000;
position: fixed;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
position: relative;
.childUl {
display: none;
position: absolute;
left: 92px !important;
top: 0 !important;
li {
width: 76px;
}
}
}
li:hover {
background: #eee;
> .childUl {
display: block;
}
}
.noEdit {
color: #e6e6e6;
cursor: not-allowed;
}
.noEdit:hover {
background: #ffffff;
}
}
}
</style>
......
<!--
* @Author: yangwei
* @Date: 2023-02-28 17:25:45
* @LastEditors: yangwei
* @LastEditTime: 2023-03-02 17:34:24
* @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ljzs.vue
* @Description:
*
* Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
-->
<template>
<div class="ljzs-wrap">
<div v-for="ljzarr in ljzsCptd" :key="ljzarr[0].bsm">
<!-- 多个同起始层逻辑幢 横向排列 -->
<div class="ch-zdy-wrap" v-if="ljzarr.length > 1">
<div v-for="ljz in ljzarr" :key="ljz.ljzmc" class="same-floor-ljz">
<div
:class="
ljz.cs.length ? 'cs-visible ch-zdy-wrap' : 'cs-none ch-zdy-wrap'
"
>
<!-- 逻辑幢名称 -->
<p class="lpb-xmmc ljz-xmmc">{{ ljz.ljzmc }}</p>
<!-- 独立层户 -->
<ch-cpn v-if="ljz.cs.length" :ch="ljz.cs" />
<!-- 幢单元 -->
<zdy-cpn v-if="ljz.zdys.length" :zdys="ljz.zdys" />
</div>
</div>
</div>
<!-- 不同起始层的逻辑幢纵向排列 -->
<div
:class="
ljzarr[0].cs.length ? 'cs-visible ch-zdy-wrap' : 'cs-none ch-zdy-wrap'
"
v-else
>
<!-- 逻辑幢名称 -->
<p class="lpb-xmmc ljz-xmmc">{{ ljzarr[0].ljzmc }}</p>
<!-- 独立层户 -->
<ch-cpn v-if="ljzarr[0].cs.length" :ch="ljzarr[0].cs" />
<!-- 幢单元 -->
<zdy-cpn v-if="ljzarr[0].zdys.length" :zdys="ljzarr[0].zdys" />
</div>
</div>
</div>
</template>
<script>
import chCpn from "./ch.vue";
import zdyCpn from "./zdys.vue";
export default {
name: "BdcdjWebLjzs",
components: { chCpn, zdyCpn },
props: {
ljzs: {
type: Array,
default: function () {
return [];
},
},
},
data() {
return {
};
},
mounted() {
console.log(this.ljzsCptd);
},
computed: {
ljzsCptd() {
let tempArr = [];
//逻辑幢数据已经按照place从小到大排序
this.ljzs.forEach((item, index) => {
//判断当前逻辑幢是否与上一个逻辑幢的起始层数相同，将起始层数相同的逻辑幢放在同一排
if (index && item.place == this.ljzs[index - 1].place) {
tempArr[index - 1].push(item);
} else {
tempArr[index] = [];
tempArr[index].push(item);
}
});
//过滤假值
return tempArr.filter(Boolean)
},
},
methods: {},
};
</script>
<style lang="scss">
.ljzs-wrap {
display: flex;
flex-direction: column-reverse;
> div {
margin-bottom: 80px;
margin-right: 20px;
display: flex;
flex-direction: column;
.ch-zdy-wrap {
display: flex;
flex-direction: row-reverse;
width: fit-content;
position: relative;
.same-floor-ljz{
display: flex;
flex-direction: row;
margin-right: 20px;
}
.ljz-xmmc {
position: absolute;
width: calc(100% + 1px);
bottom: -60px;
}
}
.cs-none {
.zdys-wrap > div:last-child {
margin-right: 0;
}
}
}
}
</style>
<!--
* @Author: yangwei
* @Date: 2023-02-28 16:29:04
* @LastEditors: yangwei
* @LastEditTime: 2023-03-02 14:45:19
* @FilePath: \bdcdj-web\src\views\lpb\lpbContent\zdys.vue
* @Description:
*
* Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
-->
<template>
<div class="zdys-wrap">
<div v-for="zdy in realZdys" :key="zdy.bsm">
<!-- 幢单元名称 -->
<p class="lpb-xmmc">
<el-checkbox @change="zdySelectAll($event,zdy.bsm)">{{
zdy.zdymc
}}</el-checkbox>
</p>
<!-- 每个幢单元下的层户 -->
<ch-cpn :ref="zdy.bsm" :ch="zdy.cs" />
</div>
</div>
</template>
<script>
import chCpn from "./ch.vue";
export default {
name: "BdcdjWebZdys",
components: { chCpn },
props: {
zdys: {
type: Array,
default: function () {
return [];
},
},
},
data() {
return {};
},
mounted() {},
methods: {
//幢单元全选
zdySelectAll(val,r) {
this.$refs[r][0].zdySelectAll(val)
},
},
computed: {
realZdys() {
return this.zdys.sort((a, b) => {
return a.zdysxh > b.zdysxh ? 1 : -1;
});
},
},
};
</script>
<style lang="scss" scoped>
.zdys-wrap {
display: flex;
flex-direction: row;
> div {
margin-right: 20px;
display: flex;
flex-direction: column-reverse;
.lpb-xmmc {
border-top: 0;
}
}
}
</style>
<template>
<div class="zdxx">
<div class="tablebox">
<table cellpadding="0" cellspacing="0" class="zdxxTable">
<col width="80" />
<col width="60" />
<col width="90" />
<col width="235" />
<col width="150" />
<tr>
<td colspan="6" class="title">宗地基本信息</td>
</tr>
<tr>
<td colspan="2">不动产类型：</td>
<td colspan="2">{{ bdclxList[zdjbxx.bdclx] }}</td>
<td>单位：</td>
<td>{{ zdjbxx.mjdw }}</td>
</tr>
<tr>
<td colspan="2">坐落</td>
<td colspan="4">{{ zdjbxx.zl }}</td>
</tr>
<tr>
<td rowspan="8" class="title2">土地状况</td>
</tr>
<tr>
<td colspan="2">宗地面积</td>
<td>{{ zdjbxx.zdmj }}</td>
<td>用途</td>
<td>{{ zdjbxx.ghytmc }}</td>
</tr>
<tr>
<td colspan="2">等级</td>
<td>{{ zdjbxx.djmc }}</td>
<td>价格</td>
<td>{{ zdjbxx.jg }}</td>
</tr>
<tr>
<td colspan="2">权利类型</td>
<td>{{ zdjbxx.qllxmc }}</td>
<td>权利性质</td>
<td>{{ zdjbxx.qlxzmc }}</td>
</tr>
<tr>
<td colspan="2">权利设定方式</td>
<td>{{ zdjbxx.qlsdfs }}</td>
<td>容积率</td>
<td>{{ zdjbxx.rjl }}</td>
</tr>
<tr>
<td colspan="2">建筑密度</td>
<td>{{ zdjbxx.jzmd }}</td>
<td>建筑限高</td>
<td>{{ zdjbxx.jzxg }}</td>
</tr>
<tr>
<td colspan="2">图幅号</td>
<td>{{ zdjbxx.tfh }}</td>
<td>地籍号</td>
<td>{{ zdjbxx.djh }}</td>
</tr>
<tr>
<td colspan="2">档案号</td>
<td>{{ zdjbxx.dah }}</td>
<td>地块代码</td>
<td>{{ zdjbxx.dkdm }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-东</td>
<td colspan="4">{{ zdjbxx.zdszd }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-南</td>
<td colspan="4">{{ zdjbxx.zdszn }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-西</td>
<td colspan="4">{{ zdjbxx.zdszx }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-北</td>
<td colspan="4">{{ zdjbxx.zdszb }}</td>
</tr>
<tr>
<td class="title2" height="96">备注</td>
<td colspan="5">{{ zdjbxx.bz }}</td>
</tr>
<tr>
<td class="title2" height="96">附记</td>
<td colspan="5">{{ zdjbxx.fj }}</td>
</tr>
<tr>
<td colspan="2">状态</td>
<td colspan="2">{{ zdjbxx.zt }}</td>
<td>区县代码</td>
<td>{{ zdjbxx.qxdm }}</td>
</tr>
<tr v-show="showGroup">
<td class="title2">变化情况</td>
<td colspan="5" class="bhqk">
<div class="box">
<table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
<tr v-for="(item, index) in bhqkColumns" :key="index">
<td class="bhqkTh">{{ item.label }}</td>
<!-- <td v-for="(item2, index2) in zdbhqks" :key="index2">
{{ item2[item.prop] }}
</td> -->
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</div>
</template>
<script>
import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
export default {
data () {
return {
bhqkColumns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "zddm",
label: "宗地代码",
},
{
prop: "bhqzddm",
label: "变化前宗地代码",
},
{
prop: "bhnr",
label: "变化内容",
},
{
prop: "bhyy",
label: "变化原因",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
],
bhqkTableWidth: 745,
zdjbxx: {},
zdbhqks: [],
propsParam: this.$attrs,
showGroup: false,
bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户']
};
},
created () {
this.loadData();
},
methods: {
loadData () {
getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
if (res.code === 200) {
this.zdjbxx = res.result.zdjbxx;
this.zdbhqks = res.result.zdbhqkList;
if (this.zdbhqks != null && this.zdbhqks.length > 0) {
this.showGroup = true;
}
}
});
},
},
};
</script>
<style lang="scss" scoped>
.zdxx {
width: 100%;
height: 100%;
background-color: #f5f5f5;
padding: 5px;
}
.tablebox {
overflow-x: auto;
width: 100%;
height: 100%;
background: #fff;
border: 1px solid rgb(228, 228, 228);
text-align: center;
padding: 4px;
overflow-y: scroll;
<div class="tableDivCss">
<table cellpadding="0" cellspacing="0" class="tableCss">
<tr>
<th colspan="5" class="title">宗地基本信息</th>
</tr>
<tr>
<td>单位</td>
<td colspan="4">{{ zdjbxx.mjdw }}</td>
</tr>
<tr>
<td>不动产类型</td>
<td colspan="4">{{ bdclxList[zdjbxx.bdclx] }}</td>
</tr>
<tr>
<td>坐落</td>
<td colspan="4">{{ zdjbxx.zl }}</td>
</tr>
<tr>
<td rowspan="8">土地状况</td>
</tr>
<tr>
<td style="width:15%">宗地面积</td>
<td style="width:30%">{{ zdjbxx.zdmj }}</td>
<td style="width:15%">用途</td>
<td style="width:30%">{{ zdjbxx.ghytmc }}</td>
</tr>
<tr>
<td>等级</td>
<td>{{ zdjbxx.djmc }}</td>
<td>价格</td>
<td>{{ zdjbxx.jg }}</td>
</tr>
<tr>
<td>权利类型</td>
<td>{{ zdjbxx.qllxmc }}</td>
<td>权利性质</td>
<td>{{ zdjbxx.qlxzmc }}</td>
</tr>
<tr>
<td>权利设定方式</td>
<td>{{ zdjbxx.qlsdfs }}</td>
<td>容积率</td>
<td>{{ zdjbxx.rjl }}</td>
</tr>
<tr>
<td>建筑密度</td>
<td>{{ zdjbxx.jzmd }}</td>
<td>建筑限高</td>
<td>{{ zdjbxx.jzxg }}</td>
</tr>
<tr>
<td>图幅号</td>
<td>{{ zdjbxx.tfh }}</td>
<td>地籍号</td>
<td>{{ zdjbxx.djh }}</td>
</tr>
<tr>
<td>档案号</td>
<td>{{ zdjbxx.dah }}</td>
<td>地块代码</td>
<td>{{ zdjbxx.dkdm }}</td>
</tr>
<tr>
<td rowspan="5">宗地四至</td>
</tr>
.zdxxTable {
width: 100%;
color: #333;
<tr>
<td>东</td>
<td colspan="3">{{ zdjbxx.zdszd }}</td>
</tr>
<tr>
<td>南</td>
<td colspan="3">{{ zdjbxx.zdszn }}</td>
</tr>
<tr>
<td>西</td>
<td colspan="3">{{ zdjbxx.zdszx }}</td>
</tr>
<tr>
<td>北</td>
<td colspan="3">{{ zdjbxx.zdszb }}</td>
</tr>
<tr>
<td>登记时间</td>
<td colspan="2">{{ zdjbxx.bz }}</td>
<td>登簿人</td>
<td>{{ zdjbxx.bz }}</td>
</tr>
td {
border: 1px solid rgb(228, 228, 228);
line-height: 30px;
padding: 0 4px;
}
<tr>
<td>附记</td>
<td colspan="4">{{ zdjbxx.fj }}</td>
</tr>
<!-- <tr>
<td>状态</td>
<td colspan="2">{{ zdjbxx.zt }}</td>
<td>区县代码</td>
<td>{{ zdjbxx.qxdm }}</td>
</tr> -->
<tr v-if="showGroup">
<td rowspan="4">变化情况</td>
.title {
line-height: 68px;
font-size: 20px;
}
<!-- <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
<tr v-for="(item, index) in bhqkColumns" :key="index">
<td class="bhqkTh">{{ item.label }}</td>
</tr>
</table> -->
.unit {
text-align: right;
}
</tr>
.title2 {
writing-mode: vertical-lr;
letter-spacing: 6px;
}
<tr v-if="showGroup">
<td >变化原因</td>
<td >变化内容</td>
<td >登记时间</td>
<td >登簿人</td>
</tr>
<!-- <tr >
<td>{{ zdbhqks[0].bhyy }}</td>
<td>{{ zdbhqks[0].bhnr }}</td>
<td>{{ zdbhqks[0].djsj }}</td>
<td>{{ zdbhqks[0].dbr }}</td>
</tr> -->
.bhqk {
padding: 0;
.box {
width: 745px;
overflow: auto;
}
.test {
}
</table>
</div>
</template>
table {
.bhqkTh {
width: 110px;
line-height: 40px;
background-color: #f5f5f5;
border: 1px solid rgb(228, 228, 228);
font-weight: bold;
}
<script>
import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
td {
width: 180px;
export default {
data() {
return {
bhqkColumns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "zddm",
label: "宗地代码",
},
{
prop: "bhqzddm",
label: "变化前宗地代码",
},
{
prop: "bhnr",
label: "变化内容",
},
{
prop: "bhyy",
label: "变化原因",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
],
bhqkTableWidth: 745,
zdjbxx: {},
zdbhqks: [],
propsParam: this.$attrs,
showGroup: false,
bdclxList: ["", "宗地", "宗海", "自然幢", "多幢", "构筑物", "林权", "户"],
};
},
created() {
this.loadData();
},
methods: {
loadData() {
getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
if (res.code === 200) {
this.zdjbxx = res.result.zdjbxx;
this.zdbhqks = res.result.zdbhqkList;
debugger;
if (this.zdbhqks != null && this.zdbhqks.length > 0) {
this.showGroup = true;
}
}
}
}
}
});
},
},
};
</script>
<style lang="scss" scoped>
@import "~@/styles/tablecss.scss";
</style>
......
......@@ -23,315 +23,315 @@
</template>
<script>
import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation'
import { editDictNode, getChildDictList } from '@/api/user'
export default {
props: {
value: { type: Boolean, default: false },
details: {
type: Object,
default: {}
}
},
data () {
return {
key: 0,
myValue: this.value,
keyList: [],
ruleForm: {
dcode: '',
dname: ''
},
column: [],
columns: [
{
width: '70',
renderHeader: (h, scope) => {
return (<div>
{
this.details.isenable === '0' ?
<span>序号</span> :
<i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
}
</div>)
},
render: (h, scope) => {
return (
<span>{scope.row.index}</span>
)
}
import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation'
import { editDictNode, getChildDictList } from '@/api/user'
export default {
props: {
value: { type: Boolean, default: false },
details: {
type: Object,
default: {}
}
},
data () {
return {
key: 0,
myValue: this.value,
keyList: [],
ruleForm: {
dcode: '',
dname: ''
},
{
prop: 'dcode',
width: '100',
label: '字典项编码',
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
column: [],
columns: [
{
width: '70',
renderHeader: (h, scope) => {
return (<div>
{
this.details.isenable === '0' ?
<span>序号</span> :
<i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
}
</div>)
},
render: (h, scope) => {
return (
<span>{scope.row.index}</span>
)
}
},
{
prop: 'dcode',
width: '100',
label: '字典项编码',
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
</div>
)
}
},
{
prop: 'dname',
label: '字典项名称',
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
</div>
)
}
},
{
prop: 'dname',
label: '字典项名称',
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
<el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
</div>
)
}
},
{
prop: 'normcode',
label: '部标编码',
width: '100',
render: (h, scope) => {
return (
<div>
<el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
<el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
</div>
)
}
},
{
prop: 'normcode',
label: '部标编码',
width: '100',
render: (h, scope) => {
return (
<div>
<el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
<el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
</div>
)
}
},
{
prop: 'normname',
label: '部标名称',
render: (h, scope) => {
return (
<div>
<el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
<el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
</div>
)
}
},
{
prop: 'normname',
label: '部标名称',
render: (h, scope) => {
return (
<div>
<el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
<el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
</div>
)
}
},
{
prop: 'isenable',
width: '160',
label: '是否禁用',
render: (h, scope) => {
return (
<el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}>
<el-radio label="1">启用</el-radio>
<el-radio label="0">禁用</el-radio>
</el-radio-group>
)
<el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
</div>
)
}
},
{
prop: 'isenable',
width: '160',
label: '是否禁用',
render: (h, scope) => {
return (
<el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}>
<el-radio label="1">启用</el-radio>
<el-radio label="0">禁用</el-radio>
</el-radio-group>
)
}
},
{
width: '130',
label: '移动',
render: (h, scope) => {
return (
<div>
<el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button>
<el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
</div >
)
}
},
{
width: '150',
label: '操作',
render: (h, scope) => {
return (
<div>
<el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
<el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
</div>
)
}
}
],
tableData: []
}
},
watch: {
value (val) {
this.myValue = val
},
'details.bsmDict': {
handler: function (newValue) {
if (!this.value) return
this.$startLoading();
getChildDictList(newValue).then(res => {
this.$endLoading();
let { result } = res
this.tableData = result ? result : []
this.tableData.forEach((item, index) => {
item.index = index + 1
})
})
},
{
width: '130',
label: '移动',
render: (h, scope) => {
return (
<div>
<el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button>
<el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
</div >
)
immediate: true
},
details: {
handler: function (newValue) {
if (newValue.isenable == 2) {
this.column = this.columns.slice(0, 6)
} else {
this.column = this.columns
}
this.ruleForm = newValue.rowData
this.addIndexes()
this.key++
},
{
width: '150',
label: '操作',
render: (h, scope) => {
return (
<div>
<el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
<el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
</div>
)
}
}
],
tableData: []
}
},
watch: {
value (val) {
this.myValue = val
deep: true
}
},
'details.bsmDict': {
handler: function (newValue) {
if (!this.value) return
this.$startLoading();
getChildDictList(newValue).then(res => {
this.$endLoading();
let { result } = res
this.tableData = result ? result : []
this.tableData.forEach((item, index) => {
methods: {
// 添加索引
addIndexes (data = this.tableData, isAdd = true) {
data.forEach((item, index) => {
if (index == 0) {
item.codeShow = true
item.nameShow = false
item.normcodeShow = false
item.normnameShow = false
} else {
item.codeShow = false
item.nameShow = false
item.normcodeShow = false
item.normnameShow = false
}
if (isAdd) {
item.index = index + 1
})
}
if (item.children) {
this.addIndexes(item.children, false)
}
})
},
immediate: true
},
details: {
handler: function (newValue) {
if (newValue.isenable == 2) {
this.column = this.columns.slice(0, 6)
} else {
this.column = this.columns
}
this.ruleForm = newValue.rowData
this.addIndexes()
this.key++
},
deep: true
}
},
methods: {
// 添加索引
addIndexes (data = this.tableData, isAdd = true) {
data.forEach((item, index) => {
if (index == 0) {
item.codeShow = true
item.nameShow = false
item.normcodeShow = false
item.normnameShow = false
} else {
itemShowFalse () {
this.tableData.forEach((item, index) => {
item.codeShow = false
item.nameShow = false
item.normcodeShow = false
item.normnameShow = false
}
if (isAdd) {
item.index = index + 1
}
if (item.children) {
this.addIndexes(item.children, false)
}
})
},
itemShowFalse () {
this.tableData.forEach((item, index) => {
item.codeShow = false
item.nameShow = false
item.normcodeShow = false
item.normnameShow = false
})
},
handleMinus (index, row) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
removeTreeListItem(this.tableData, row.bsmDict)
this.$message({
type: 'success',
message: '删除成功!'
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
handleSubmit () {
editDictNode({
bsmDict: this.details.rowData.bsmDict,
typeid: this.details.rowData.typeid,
children: this.tableData
}).then(res => {
if (res.code === 200) {
},
handleMinus (index, row) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
removeTreeListItem(this.tableData, row.bsmDict)
this.$message({
message: '修改成功',
type: 'success'
type: 'success',
message: '删除成功!'
})
this.$emit('input', false)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
handleSubmit () {
editDictNode({
bsmDict: this.details.rowData.bsmDict,
typeid: this.details.rowData.typeid,
children: this.tableData
}).then(res => {
if (res.code === 200) {
this.$message({
message: '修改成功',
type: 'success'
})
this.$emit('input', false)
}
})
},
closeDialog () {
this.$emit('input', false)
},
// 增加下级
handleAddSubordinate (row) {
if (!row.children) {
row.children = []
}
})
},
closeDialog () {
this.$emit('input', false)
},
// 增加下级
handleAddSubordinate (row) {
if (!row.children) {
row.children = []
row.children.push(
{
dcode: '',
dname: '',
isenable: '1',
normcode: '',
normname: '',
bsmDict: getUuid(32),
typeid: row.typeid,
}
)
this.keyList = [];
this.keyList.push(row.bsmDict)
},
// 增加
handleAdd () {
this.$nextTick(() => {
let container = this.$el.querySelector('.el-table__body-wrapper');
container.scrollTop = container.scrollHeight;
})
this.tableData.push(
{
dcode: '',
dname: '',
isenable: '1',
normcode: '',
normname: '',
bsmDict: getUuid(32),
typeid: this.ruleForm.typeid,
}
)
this.addIndexes()
this.key++
},
// 上移下移
moveUpward (index, row) {
realMove(row.bsmDict, 'UP', this.tableData)
this.key++
let id = findParents(this.tableData, row.bsmDict)
this.keyList = id
},
moveDown (index, row) {
realMove(row.bsmDict, 'DOWN', this.tableData)
this.key++
let id = findParents(this.tableData, row.bsmDict)
this.keyList = id
}
row.children.push(
{
dcode: '',
dname: '',
isenable: '1',
normcode: '',
normname: '',
bsmDict: getUuid(32),
typeid: row.typeid,
}
)
this.keyList = [];
this.keyList.push(row.bsmDict)
},
// 增加
handleAdd () {
this.$nextTick(() => {
let container = this.$el.querySelector('.el-table__body-wrapper');
container.scrollTop = container.scrollHeight;
})
this.tableData.push(
{
dcode: '',
dname: '',
isenable: '1',
normcode: '',
normname: '',
bsmDict: getUuid(32),
typeid: this.ruleForm.typeid,
}
)
this.addIndexes()
this.key++
},
// 上移下移
moveUpward (index, row) {
realMove(row.bsmDict, 'UP', this.tableData)
this.key++
let id = findParents(this.tableData, row.bsmDict)
this.keyList = id
},
moveDown (index, row) {
realMove(row.bsmDict, 'DOWN', this.tableData)
this.key++
let id = findParents(this.tableData, row.bsmDict)
this.keyList = id
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "~@/styles/dialogBoxheader.scss";
/deep/.el-radio {
margin-right: 5px !important;
}
@import "~@/styles/dialogBoxheader.scss";
/deep/.el-radio {
margin-right: 5px !important;
}
</style>
......
......@@ -4,203 +4,229 @@
-->
<template>
<div class='spyj loadingtext'>
<b class="spyj_title">审批表</b>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px">
<div class="spyj_form" v-for="(item, index) in tableData" :key="index">
<div class="item_left">
{{ item.jdmc }}意见
<div class="box">
<b class="spyj_title">审批表</b>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px">
<div class="spyj_form" v-for="(item, index) in tableData" :key="index">
<div class="item_left">
{{ item.jdmc }}意见
</div>
<div class="item_right">
<el-row>
<el-col :span="24">
<el-form-item label-width="0" class="opinion_item" prop="shyj">
<el-input type="textarea" :rows="4" class="opinion" placeholder="请输入审批意见"
v-if="item.stepShjy == '1' && ableOperation" v-model="ruleForm.shyj"></el-input>
<el-input type="textarea" :rows="4" class="opinion" v-model="item.shyj" v-else :disabled="true">
</el-input>
<el-button class="opinion_btn" @click="commonOpinion"
v-if="item.stepShjy == '1' && ableOperation">常用意见</el-button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="审查人" prop="shryxm">
{{ item.shryxm }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="审核时间" prop="shjssj" :key="refresh">
{{ item.shjssj }}
</el-form-item>
</el-col>
</el-row>
</div>
</div>
<div class="item_right">
<el-row>
<el-col :span="24">
<el-form-item label-width="0" class="opinion_item" prop="shyj">
<el-input type="textarea" :rows="4" class="opinion" placeholder="请输入审批意见"
v-if="item.stepShjy == '1' && ableOperation" v-model="ruleForm.shyj"></el-input>
<el-input type="textarea" :rows="4" class="opinion" v-model="item.shyj" v-else :disabled="true">
</el-input>
<el-button class="opinion_btn" @click="commonOpinion"
v-if="item.stepShjy == '1' && ableOperation">常用意见</el-button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="审查人：" prop="shryxm">
{{ item.shryxm }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="审核时间：" prop="shjssj" :key="refresh">
{{ item.shjssj }}
</el-form-item>
</el-col>
</el-row>
<div class="submit_button" v-if="ableOperation">
<el-button type="primary" @click="onSubmit">保存</el-button>
</div>
</div>
<div class="submit_button" v-if="ableOperation">
<el-button type="primary" @click="onSubmit">保存</el-button>
</div>
</el-form>
</el-form>
</div>
<el-empty v-if="isNoData" description="暂无数据"></el-empty>
<commonDialog v-model="commonDialog" />
</div>
</template>
<script>
import { getSpyjList, saveSpyj, saveSpyjBySlsq } from "@/api/fqsq.js";
import { popupDialog } from "@/utils/popup.js";
import commonDialog from "./commonOpinion.vue";
import { mapGetters } from 'vuex'
export default {
components: { commonDialog },
props: {
},
computed: {
...mapGetters(['userData'])
},
data () {
return {
isNoData: false,
bsmSlsq: '',
//刷新值
refresh: 10,
ableOperation: true,
bsmSlsq: this.$route.query.bsmSlsq,
bestepid: this.$route.query.bestepid,
ruleForm: {},
rules: {
shyj: [
{ required: true, message: '请输入审批意见', trigger: 'blur' }
],
},
tableData: [],
propsParam: {},
commonDialog: false
}
},
mounted () {
this.propsParam = this.$attrs;
if (this.$route.query.viewtype) {
this.ableOperation = false
}
this.list();
},
methods: {
handleClick () {
console.log(1)
import { getSpyjList, saveSpyj, saveSpyjBySlsq } from "@/api/fqsq.js";
import { popupDialog } from "@/utils/popup.js";
import commonDialog from "./commonOpinion.vue";
import { mapGetters } from 'vuex'
export default {
components: { commonDialog },
props: {
},
//审批意见数据初始化
list () {
let that = this
this.$startLoading()
var formdata = new FormData();
formdata.append("bsmBusiness", this.propsParam.bsmBusiness);
formdata.append("bestepid", this.$route.query.bestepid);
formdata.append("ableOperation", this.ableOperation)
getSpyjList(formdata).then((res) => {
this.$endLoading()
if (res.code === 200 && res.result) {
this.tableData = res.result ? res.result : []
if (res.result.length == 0) {
that.isNoData = true
}
this.ruleForm = res.result[res.result.length - 1]
}
})
computed: {
...mapGetters(['userData'])
},
onSubmit () {
this.ruleForm.bsmSlsq = this.bsmSlsq
this.ruleForm.bestepid = this.bestepid
saveSpyjBySlsq(this.ruleForm).then(res => {
if (res.code === 200) {
this.$message.success("保存成功")
this.refresh += 1
} else {
this.$message.error(res.message)
}
})
data () {
return {
isNoData: false,
bsmSlsq: '',
//刷新值
refresh: 10,
ableOperation: true,
bsmSlsq: this.$route.query.bsmSlsq,
bestepid: this.$route.query.bestepid,
ruleForm: {},
rules: {
shyj: [
{ required: true, message: '请输入审批意见', trigger: 'blur' }
],
},
tableData: [],
propsParam: {},
commonDialog: false
}
},
//打开常用意见列表弹窗
commonOpinion () {
this.commonDialog = true
mounted () {
this.propsParam = this.$attrs;
if (this.$route.query.viewtype) {
this.ableOperation = false
}
this.list();
},
//使用常用意见
useOpinion (opinion) {
this.ruleForm.shyj = opinion
methods: {
handleClick () {
console.log(1)
},
//审批意见数据初始化
list () {
let that = this
this.$startLoading()
var formdata = new FormData();
formdata.append("bsmBusiness", this.propsParam.bsmBusiness);
formdata.append("bestepid", this.$route.query.bestepid);
formdata.append("ableOperation", this.ableOperation)
getSpyjList(formdata).then((res) => {
this.$endLoading()
if (res.code === 200 && res.result) {
this.tableData = res.result ? res.result : []
if (res.result.length == 0) {
that.isNoData = true
}
this.ruleForm = res.result[res.result.length - 1]
}
})
},
onSubmit () {
this.ruleForm.bsmSlsq = this.bsmSlsq
this.ruleForm.bestepid = this.bestepid
saveSpyjBySlsq(this.ruleForm).then(res => {
if (res.code === 200) {
this.$message.success("保存成功")
this.refresh += 1
} else {
this.$message.error(res.message)
}
})
},
//打开常用意见列表弹窗
commonOpinion () {
this.commonDialog = true
},
//使用常用意见
useOpinion (opinion) {
this.ruleForm.shyj = opinion
}
}
}
}
</script>
<style scoped lang='scss'>
@import '~@/styles/mixin.scss';
.spyj {
margin-left: 5px;
height: 400px;
.spyj_title {
text-align: center;
font-size: 18px;
display: block;
margin: 5px;
}
@import "~@/styles/mixin.scss";
/deep/.el-form-item {
margin-bottom: 0;
}
.bottom10 {
margin-bottom: 15px;
}
.spyj {
width: 100%;
height: 100%;
background-color: #f5f5f5;
padding: 5px;
.box {
overflow-x: auto;
width: 100%;
height: 95%;
background: #fff;
text-align: center;
padding: 4px;
overflow-y: scroll;
padding-top: 20px;
padding: 20px 40px;
}
.spyj_title {
line-height: 68px;
border: 1px solid $borderColor;
text-align: center;
font-size: 22px;
font-weight: 400;
background-color: #eceef2;
display: block;
border-bottom: none;
}
.spyj_form {
display: flex;
border: 1px solid $borderColor;
/deep/.el-form-item {
margin-bottom: 0;
}
.item_left {
width: 150px;
background-color: #F8F8FA;
color: #606266;
@include flex-center;
border-right: 1px solid $borderColor;
.bottom10 {
margin-bottom: 15px;
}
.item_right {
flex: 1;
width: 100%;
.spyj_form {
display: flex;
border: 1px solid $borderColor;
/deep/.el-form-item__label {
background-color: #F8F8FA;
.item_left {
width: 150px;
background-color: #f8f8fa;
color: #606266;
display: flex;
font-size: 14px;
text-indent: 80px;
align-items: center;
border-right: 1px solid $borderColor;
}
.opinion_item {
/deep/.el-form-item__error {
margin-top: -16px !important;
left: 3px;
.item_right {
flex: 1;
width: 100%;
/deep/.el-form-item__label {
background-color: #f8f8fa;
}
/deep/.el-form-item__content {
display: block;
text-align: left;
padding-left: 15px;
text-indent: 10px;
}
.opinion_item {
/deep/.el-form-item__error {
margin-top: -16px !important;
left: 3px;
}
border-bottom: 1px solid $borderColor;
}
border-bottom: 1px solid $borderColor;
}
.opinion {
position: relative;
font-size: 16px;
.opinion {
position: relative;
font-size: 14px;
/deep/.el-textarea__inner {
border: none;
/deep/.el-textarea__inner {
border: none;
}
}
}
.opinion_btn {
position: absolute;
right: 15px;
bottom: 10px;
.opinion_btn {
position: absolute;
right: 15px;
bottom: 10px;
}
}
}
}
.submit_button {
text-align: center;
margin: 15px 0;
.submit_button {
text-align: center;
margin: 15px 0;
}
}
}
</style>
\ No newline at end of file
</style>
......
......@@ -3,37 +3,37 @@ export function getForm (tabName, djywbm) {
let form;
switch (tabName) {
case "jsydsyqslxx100":
form = require("@/views/ywbl/ywSlxx/jsydsyq/slxx.vue");
form = require("@/views/ywbl/slsqxx/jsydsyq/slxx.vue");
break;
case "jsydsyqslxx300":
form = require("@/views/ywbl/ywSlxx/jsydsyq/slxx300.vue");
form = require("@/views/ywbl/slsqxx/jsydsyq/slxx300.vue");
break;
case "fwsyqslxx100":
form = require("@/views/ywbl/fdcq2/slxx.vue");
form = require("@/views/ywbl/slsqxx/fdcq2/slxx.vue");
break;
case "fwsyqslxx300":
form = require("@/views/ywbl/fdcq2/slxx300.vue");
form = require("@/views/ywbl/slsqxx/fdcq2/slxx300.vue");
break;
case "nydsyqslxx100":
form = require("@/views/ywbl/ywSlxx/nydsyq/slxx.vue");
form = require("@/views/ywbl/slsqxx/nydsyq/slxx.vue");
break;
case "nydsyqslxx200":
form = require("@/views/ywbl/ywSlxx/nydsyq/slxx200.vue");
form = require("@/views/ywbl/slsqxx/nydsyq/slxx200.vue");
break;
case "tdslxxCfdj":
form = require("@/views/ywbl/cfdj/tdslxx.vue");
form = require("@/views/ywbl/slsqxx/cfdj/tdslxx.vue");
break;
case "plslxxCfdj":
form = require("@/views/ywbl/cfdj/plcfslxx.vue");
form = require("@/views/ywbl/slsqxx/cfdj/plcfslxx.vue");
break;
case "diyaqSlxx":
form = require("@/views/ywbl/ywSlxx/diyaq/slxx.vue");
form = require("@/views/ywbl/slsqxx/diyaq/slxx.vue");
break;
case "diyaqSlxx200":
form = require("@/views/ywbl/ywSlxx/diyaq/slxx200.vue");
form = require("@/views/ywbl/slsqxx/diyaq/slxx200.vue");
break;
case "diyaqSlxx300":
form = require("@/views/ywbl/ywSlxx/diyaq/slxx200.vue");
form = require("@/views/ywbl/slsqxx/diyaq/slxx200.vue");
break;
case "clxx":
form = require("@/views/workflow/components/clxxUnify.vue");
......@@ -45,17 +45,17 @@ export function getForm (tabName, djywbm) {
form = require("@/views/registerBook/zdjbxx.vue");
break;
case "ygmm100":
form = require("@/views/ywbl/ywSlxx/ygdj/slxx.vue");
form = require("@/views/ywbl/slsqxx/ygdj/slxx.vue");
break;
case "ygmm300":
form = require("@/views/ywbl/ywSlxx/ygdj/slxx300.vue");
form = require("@/views/ywbl/slsqxx/ygdj/slxx300.vue");
break;
case "ygdy100":
case "ygdy300":
form = require("@/views/ywbl/ywSlxx/ygdy/slxx.vue");
form = require("@/views/ywbl/slsqxx/ygdy/slxx.vue");
break;
case "zjgcdyqSlxx":
form = require("@/views/ywbl/ywSlxx/zjgcdy/slxx.vue");
form = require("@/views/ywbl/slsqxx/zjgcdy/slxx.vue");
break;
case "cfdjxx":
form = require("@/views/registerBook/cfdj.vue");
......
......@@ -211,7 +211,7 @@ export default {
record(formdata).then((res) => {
if (res.code === 200) {
if (res.result.length === 1) {
res.result[0].state ? that.$alert("登簿成功！") : that.$alert(res.result[0].msg);;
res.result[0].state ? that.$alert("登簿成功!") : that.$alert(res.result[0].msg);;
}
else {
that.$alert('<div>' + res.result[0].ywh + ',' + res.result[0].msg + '</div>', '登簿明细', {
......@@ -230,7 +230,7 @@ export default {
sendToNext(obj) {
const h = this.$createElement;
this.$msgbox({
title: "您确定转出吗？1",
title: "您确定转出吗?",
message: h("div", { style: "margin: auto" }, [
h("span", null, "下个环节名称："),
h("i", { style: "color: teal" }, obj.taskName),
......
......@@ -122,13 +122,13 @@
</el-form-item>
</el-col>
</el-row>
<!-- <div class="slxx_title title-block">
<div class="slxx_title title-block">
权利人信息
<div class="triangle"></div>
</div> -->
<el-divider content-position="left"><i
</div>
<!-- <el-divider content-position="left"><i
style="background-color:#3498db;font-size:16px;color:#fff !important;border-radius: 5px 5px 5px 0px;margin-bottom:10px;"
class="el-icon-edit-outline">权利人信息</i></el-divider>
class="el-icon-edit-outline">权利人信息</i></el-divider> -->
<el-row :gutter="10">
<el-col :span="14">
<el-form-item label="共有方式：">
......
......@@ -24,6 +24,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -33,6 +33,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -48,6 +48,7 @@
<el-col :span="3" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......@@ -98,6 +99,7 @@
<el-col :span="3" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......@@ -268,8 +270,6 @@
}
})
}
}
}
</script>
......
......@@ -18,6 +18,7 @@
</el-col>
<el-col :span="4" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -18,6 +18,7 @@
</el-col>
<el-col :span="4" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -33,6 +33,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -25,6 +25,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -25,6 +25,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -33,7 +33,7 @@
<el-form-item label="权利人">
<el-input
placeholder="请输入权利人"
v-model="queryForm.zl"
v-model="queryForm.qlr"
clearable
class="width300px"
>
......@@ -53,6 +53,7 @@
</el-col>
<el-col :span="4" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......@@ -111,8 +112,10 @@ export default {
},
methods: {
queryClick() {
this.$startLoading();
this.queryForm.sqywbm = this.sqywInfo.djywbm;
selectJsydQlxx({ ...this.queryForm, ...this.pageData }).then((res) => {
this.$endLoading();
if (res.code === 200) {
let { total, records } = res.result;
this.tableData.total = total;
......
......@@ -18,6 +18,7 @@
</el-col>
<el-col :span="4" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -25,6 +25,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -25,6 +25,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm(true)">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......
......@@ -25,6 +25,7 @@
</el-col>
<el-col :span="2" class="btnColRight">
<el-form-item>
<el-button type="primary" @click="resetForm">重置</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-form-item>
</el-col>
......