productDev/funingyunwei.git

			@@ -194,73 +194,73 @@
			</el-tab-pane>
			<el-tab-pane label="租客合同" name="project" v-if="[3].includes(lv)">
			<div class="xm">
			<el-card style="margin-top: 20px;">
			<div slot="header" class="clearfix">
			<span>当前在租合同</span>
			<div class="xm_table">
			<div style="display: flex; align-items: center; margin-bottom: 15px;">
			<el-input v-model="form.code" style="width: 150px; margin-right: 15px;" placeholder="请输入合同编号"></el-input>
			<el-button type="primary" @click="getFetchList">搜索</el-button>
			<el-button @click="clear">重置</el-button>
			</div>
			<div class="xm_table">
			<div style="display: flex; align-items: center; margin-bottom: 15px;">
			<el-input v-model="form.code" style="width: 150px; margin-right: 15px;" placeholder="请输入合同编号"></el-input>
			<el-button type="primary" @click="getFetchList">搜索</el-button>
			<el-button @click="clear">重置</el-button>
			</div>
			<el-table
			:data="tableData"
			border
			v-loading="loading"
			style="width: 100%">
			<el-table-column
			label="合同编号">
			<template slot-scope="{row}">
			<el-button type="text" @click="$refs.ContractDetailRef.open('合同详情', row.id)">{{row.code}}</el-button>
			</template>
			</el-table-column>
			<el-table-column
			prop="renterName"
			label="租客">
			</el-table-column>
			<el-table-column
			label="租赁单价">
			<template slot-scope="{row}">
			<div style="display: flex; align-items: center;">
			<span>{{row.leasePrice \|\| 0}}元/㎡·天</span>
			</div>
			</template>
			</el-table-column>
			<el-table-column
			prop="leaseDays"
			label="租赁天数">
			</el-table-column>
			<el-table-column
			label="租赁面积">
			<template slot-scope="{row}">
			{{row.totalArea}}㎡
			</template>
			</el-table-column>
			<el-table-column
			label="房源">
			<template slot-scope="{row}">
			<div style="display: flex; flex-direction: column;">
			<span v-for="(item, index) in row.roomList" :key="index">
			{{item.projectName}}/{{item.buildingName}}/{{item.floorName}}/{{item.roomNum}}
			</span>
			</div>
			</template>
			</el-table-column>
			</el-table>
			<div class="xm_table_f">
			<el-pagination
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
			:current-page="page"
			:page-sizes="[10, 20, 30, 40]"
			:page-size="pageTotal"
			layout="total, sizes, prev, pager, next, jumper"
			:total="total">
			</el-pagination>
			</div>
			<el-table
			:data="tableData"
			border
			v-loading="loading"
			style="width: 100%">
			<el-table-column
			label="合同编号">
			<template slot-scope="{row}">
			<el-button type="text" @click="$refs.ContractDetailRef.open('合同详情', row.id)">{{row.code}}</el-button>
			</template>
			</el-table-column>
			<el-table-column
			label="租客">
			<template slot-scope="{row}">
			<div style="display: flex; align-items: center;">
			{{row.renterName}}
			<el-tag type="success" v-if="[1,2,3].includes(row.status)">当前租户</el-tag>
			</div>
			</template>
			</el-table-column>
			<el-table-column
			label="租赁单价">
			<template slot-scope="{row}">
			<div style="display: flex; align-items: center;">
			<span>{{row.leasePrice \|\| 0}}元/㎡·天</span>
			</div>
			</template>
			</el-table-column>
			<el-table-column
			prop="leaseDays"
			label="租赁天数">
			</el-table-column>
			<el-table-column
			label="租赁面积">
			<template slot-scope="{row}">
			{{row.totalArea}}㎡
			</template>
			</el-table-column>
			<el-table-column
			label="房源">
			<template slot-scope="{row}">
			<div style="display: flex; flex-direction: column;">
			<span v-for="(item, index) in row.roomList" :key="index">
			{{item.projectName}}/{{item.buildingName}}/{{item.floorName}}/{{item.roomNum}}
			</span>
			</div>
			</template>
			</el-table-column>
			</el-table>
			<div class="xm_table_f">
			<el-pagination
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
			:current-page="page"
			:page-sizes="[10, 20, 30, 40]"
			:page-size="pageTotal"
			layout="total, sizes, prev, pager, next, jumper"
			:total="total">
			</el-pagination>
			</div>
			</el-card>
			</div>
			</div>
			</el-tab-pane>
			<el-tab-pane label="房态管理" name="house" v-if="[1,2].includes(lv)">
			@@ -282,27 +282,30 @@
			</div>
			<div class="xm_house_list" v-for="(item, index) in roomStatus" :key="index">
			<div class="xm_house_list_left">
			<div class="xm_house_list_left_row">
			<div class="xm_house_list_left_row" :style="{ height: (item.roomsList.length * 100) + ((item.roomsList.length - 1) * 10) + 'px' }">
			<span>{{item.floorName}}</span>
			<span>{{item.floorArea}}㎡</span>
			</div>
			</div>
			<div class="xm_house_list_right">
			<div class="xm_house_list_right_row" :style="{ width: child.width + 'px', backgroundColor: ifBackground(child.roomStatus) }" v-for="(child, i) in item.ywRoomStatusDataVOList" :key="i">
			<div class="ft">
			<span>{{child.roomCode}}</span>
			<span>（{{child.roomRentArea}}㎡）</span>
			</div>
			<div class="xm_house_list_right_row_info" v-if="child.roomStatus !== 0">
			<div style="display: flex; align-items: center;">
			<span style="margin-right: 5px;">{{child.customerName}}</span>
			<img src="@/assets/icons/ic_key_green.png" style="width: 16px; height: 16px;" v-if="child.roomStatus === 1" />
			<img src="@/assets/icons/ic_key_yellow.png" style="width: 16px; height: 16px;" v-else-if="child.roomStatus === 2" />
			<template v-for="(child, i) in item.roomsList" :key="i">
			<div class="xm_house_list_right_row" v-for="(childThree, a) in child" :key="a" :style="{ width: childThree.width + 'px', backgroundColor: ifBackground(childThree.roomStatus) }">
			<div class="ft">
			<span>{{childThree.roomCode}}</span>
			<span>（{{childThree.roomRentArea}}㎡）</span>
			</div>
			<span :style="{ color: returnColor(child.overData.substring(0, 10)) ? 'red' : '' }">{{child.overData.substring(0, 10)}}{{returnColor(child.overData.substring(0, 10)) ? '已' : ''}}到期</span>
			<div class="xm_house_list_right_row_info" v-if="childThree.roomStatus !== 0">
			<div style="display: flex; align-items: center;">
			<span style="margin-right: 5px;">{{childThree.customerName}}</span>
			<img src="@/assets/icons/ic_key_green.png" style="width: 16px; height: 16px;" v-if="childThree.roomStatus === 1" />
			<img src="@/assets/icons/ic_key_yellow.png" style="width: 16px; height: 16px;" v-else-if="childThree.roomStatus === 2" />
			</div>
			<span :style="{ color: returnColor(childThree.overData.substring(0, 10)) ? 'red' : '' }">{{childThree.overData.substring(0, 10)}}{{returnColor(childThree.overData.substring(0, 10)) ? '已' : ''}}到期</span>
			</div>
			<div class="xm_house_list_right_row_day" v-if="childThree.roomStatus === 0">未出租｜空置{{childThree.freeDayAmount}}天</div>
			</div>
			<div class="xm_house_list_right_row_day" v-if="child.roomStatus === 0">未出租｜空置{{child.freeDayAmount}}天</div>
			</div>
			</template>

			</div>
			</div>
			</div>
			@@ -710,7 +713,8 @@
			lv: 0,
			leaseStatus: '',
			amount: 0,
			project: ''
			project: '',
			widthNum: ''
			}
			},
			created () {
			@@ -829,12 +833,48 @@
			buildingId: this.form.buildingId,
			floor: this.form.floorId
			}).then(res => {
			// 数组分割
			res.forEach(item => {
			let num = item.ywRoomStatusDataVOList.map(item => item.roomRentArea)
			let total = num.reduce((sum, value) => sum + value, 0)
			item.ywRoomStatusDataVOList.forEach(child => {
			// let percentage = (child.roomRentArea / total) * 100; // 计算每个值的占比
			child.width = (child.roomRentArea / total) * 854
			item.ywRoomStatusDataVOList = item.ywRoomStatusDataVOList ? item.ywRoomStatusDataVOList : []
			const chunkedArray = [];
			for (let i = 0; i < item.ywRoomStatusDataVOList.length; i += 4) {
			chunkedArray.push(item.ywRoomStatusDataVOList.slice(i, i + 4));
			}
			item.roomsList = chunkedArray
			})
			// 计算宽度
			res.forEach(item => {
			item.roomsList.forEach(one => {
			let num = one.map(three => three.roomRentArea)
			let total = num.reduce((sum, value) => sum + value, 0)
			let width = 950
			if (one.length > 1) {
			width = 950 - ((one.length - 1) * 10)
			}
			one.forEach(two => {
			two.width = Number(Math.max((two.roomRentArea / total) * width, 150).toFixed(0))
			})
			})
			})
			// 减去平均多余的宽度
			res.forEach(item => {
			item.roomsList.forEach(one => {
			let num = one.map(three => three.width)
			let total = num.reduce((sum, value) => sum + value, 0)
			let countGreaterThan150 = one.filter(num => num.width > 150).length;
			let width = 950
			if (one.length > 1) {
			width = 950 - ((one.length - 1) * 10)
			}
			if (total > width) {
			let cha = total - width
			let deleNum = Math.floor(cha / countGreaterThan150)
			one.forEach(two => {
			if (two.width > 150) {
			two.width = two.width - deleNum
			}
			})
			}
			})
			})
			this.roomStatus = res
			@@ -853,7 +893,7 @@
			this.$nextTick(() => {
			this.deviceList = [
			{ value: res.workAmount \|\| 0, name: '正常' },
			{ value: res.exceptionAmount \|\| 0, name: '异常' },
			{ value: res.exceptionAmount \|\| 0, name: '损坏' },
			{ value: res.errAmount \|\| 0, name: '报废' }
			]
			this.amount = res.amount
			@@ -880,6 +920,7 @@
			this.$nextTick(() => {
			this.$refs.EditRef.param.projectId = this.project
			this.$refs.EditRef.isShowModal = true
			this.$refs.EditRef.changeProject()
			})
			},
			// 获取设备分页
			@@ -1016,7 +1057,7 @@
			floorId: this.form.floorId,
			roomId: this.form.roomId,
			code: this.form.code,
			statusList: [0,1,2,3]
			statusList: this.lv !== 3 ? [0,1,2,3] : null
			}
			}).then(res => {
			this.tableData = res.records
			@@ -1144,7 +1185,7 @@
			this.getFetchList()
			} else if (this.activeName === 'second') {
			this.getWorkOrderList()
			} else if (tab.name === 'third') {
			} else if (this.activeName === 'third') {
			this.getDevicePage()
			}
			},
			@@ -1245,17 +1286,17 @@
			.xm_house_list {
			width: 100%;
			display: flex;
			align-items: center;
			margin-top: 10px;
			align-items: self-start;
			.xm_house_list_left {
			flex-shrink: 0;
			width: 100px;
			display: flex;
			margin-right: 15px;
			flex-direction: column;
			margin-bottom: 10px;
			.xm_house_list_left_row {
			width: 100px;
			height: 100px;
			/height: 100px;/
			background: #F4F7FC;
			padding: 20px 0;
			box-sizing: border-box;
			@@ -1263,7 +1304,7 @@
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: space-between;
			justify-content: center;
			&:last-child {
			margin-bottom: 0;
			}
			@@ -1283,9 +1324,11 @@
			}
			}
			.xm_house_list_right {
			width: 854px;
			width: 950px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			flex-wrap: wrap;
			.xm_house_list_right_row {
			height: 100px;
			padding: 12px 15px;
			@@ -1293,10 +1336,7 @@
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-right: 10px;
			&:last-child {
			margin: 0 !important;
			}
			margin-bottom: 10px;
			.ft {
			display: flex;
			align-items: center;
			@@ -1339,6 +1379,7 @@
			.xm_house_tips {
			display: flex;
			align-items: center;
			margin-bottom: 10px;
			.xm_house_tips_row {
			display: flex;
			align-items: center;