|
@@ -15,7 +15,73 @@
|
|
|
<el-radio-button label="3">可视化进度</el-radio-button>
|
|
|
</el-radio-group>
|
|
|
<div class="topContain">
|
|
|
- <div style="width: 100%;height: 100%;">
|
|
|
+ <el-form :model="searchParam" ref="searchForm" class="searchForm">
|
|
|
+ <el-form-item label="行政区" prop="district">
|
|
|
+ <el-select v-model="info.district" placeholder="请选择行政区" clearable
|
|
|
+ @change="searchParam.areaId = undefined;getAreaList(info.district)"
|
|
|
+ @clear="searchParam.areaId = undefined;areaList=[];
|
|
|
+ searchParam.buildingId = undefined;buildingList=[];
|
|
|
+ searchParam.unitId = undefined;unitList=[]">
|
|
|
+ <el-option
|
|
|
+ v-for="dict in dict.type.district"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="小区名称" prop="areaId">
|
|
|
+ <el-select v-model="searchParam.areaId" filterable clearable placeholder="请选择小区"
|
|
|
+ @change="searchParam.buildingId = undefined;getBuildingList1(searchParam.areaId)"
|
|
|
+ @clear="searchParam.buildingId = undefined;buildingList=[];
|
|
|
+ searchParam.unitId = undefined;unitList=[]">
|
|
|
+ <el-option
|
|
|
+ v-for="item in areaList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="楼宇名称" prop="buildingId">
|
|
|
+ <el-select v-model="searchParam.buildingId" filterable clearable placeholder="请选择楼宇"
|
|
|
+ @change="searchParam.unitId = undefined;getUnitList1(searchParam.buildingId)"
|
|
|
+ @clear="searchParam.unitId = undefined;unitList=[]"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in buildingList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="单元" prop="unitId">
|
|
|
+ <el-select v-model="searchParam.unitId" placeholder="请选择单元" filterable clearable>
|
|
|
+ <el-option
|
|
|
+ v-for="obj in unitList"
|
|
|
+ :key="obj.id"
|
|
|
+ :label="obj.name"
|
|
|
+ :value="obj.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工程周期" prop="enginCycle">
|
|
|
+ <el-select
|
|
|
+ :disabled="title == '添加用料' "
|
|
|
+ v-model="searchParam.enginCycle"
|
|
|
+ placeholder="请填写工程周期"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="e in dict.type.engin_cycle"
|
|
|
+ :key="e.value"
|
|
|
+ :label="e.label"
|
|
|
+ :value="e.value"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <!-- <div style="width: 100%;height: 100%;">
|
|
|
<el-select
|
|
|
v-model="currentCommunity"
|
|
|
placeholder="请选择行政区"
|
|
@@ -66,8 +132,8 @@
|
|
|
type="date"
|
|
|
placeholder="选择日期">
|
|
|
</el-date-picker>
|
|
|
- </div>
|
|
|
- <el-button class="searchBtn">查询</el-button>
|
|
|
+ </div> -->
|
|
|
+ <el-button class="searchBtn" @click="searchCompletionInfo">查询</el-button>
|
|
|
<el-button class="searchBtn">导出</el-button>
|
|
|
<div class="unitStatus">
|
|
|
<div
|
|
@@ -84,17 +150,49 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 房间集合 -->
|
|
|
- <ConstructionDetails/>
|
|
|
+ <!-- 楼栋 or 单元 -->
|
|
|
+ <div style="width: 1618px;display: flex;padding-left: 3%;justify-content: space-around;">
|
|
|
+ <div
|
|
|
+ v-for="(e,idx) in roomsInfo"
|
|
|
+ :key="idx"
|
|
|
+ class="buildingContain"
|
|
|
+ >
|
|
|
+ <!-- 楼层 -->
|
|
|
+ <div
|
|
|
+ v-for="(v,vdx) in e.roomStatusVoList"
|
|
|
+ :key="vdx"
|
|
|
+ class="unitFloor"
|
|
|
+ >
|
|
|
+ {{ v.notstart || '' }}
|
|
|
+ <!-- 房间 -->
|
|
|
+ <div
|
|
|
+ v-for="(k,kdx) in v"
|
|
|
+ :key="kdx"
|
|
|
+ class="room"
|
|
|
+ @click="toDetail(k)"
|
|
|
+ :style="`background-color:${k.roomStatus == '未开工' ? '#999999' : k.roomStatus == '进行中' ? '#FFFF66' : '#009900'}`"
|
|
|
+ >
|
|
|
+ {{ k.roomName || '' }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <ConstructionDetails/> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import ConstructionDetails from '@/components/ConstructionDetails'
|
|
|
+import {getAreaList} from "@/api/zdsz/area";
|
|
|
+import {getBuildingList} from "@/api/zdsz/building";
|
|
|
+import {getUnits} from "@/api/zdsz/unit";
|
|
|
+import { getObtainRoomcCompletionInformationList } from "@/api/zdsz/enginee"
|
|
|
export default {
|
|
|
name:'ProgreVisual',
|
|
|
components:{
|
|
|
ConstructionDetails
|
|
|
},
|
|
|
+ dicts:['district','engin_cycle'],
|
|
|
data(){
|
|
|
return {
|
|
|
currentMenu:3, // 0:用料管理 1:进度统计 2:可视化进度
|
|
@@ -162,16 +260,59 @@ export default {
|
|
|
],
|
|
|
currentType:null,
|
|
|
currentCommunity:null,
|
|
|
+ areaList:[],
|
|
|
+ buildingList:[],
|
|
|
+ unitList:[],
|
|
|
+ info:{
|
|
|
+ district: undefined,
|
|
|
+ },
|
|
|
+ searchParam:{
|
|
|
+ enginCycle:null,
|
|
|
+ areaId: null,
|
|
|
+ buildingId: null,
|
|
|
+ unitId: null,
|
|
|
+ },
|
|
|
+ roomsInfo:[]
|
|
|
}
|
|
|
},
|
|
|
methods:{
|
|
|
- toModule(){
|
|
|
- console.log(this.$router)
|
|
|
- const currentPage = this.currentMenu == 0 ? 'material_statistics' : this.currentMenu == 1 ? 'progres_statistics' :this.currentMenu == 2 ? 'echarts_statistics': 'progres_visual'
|
|
|
- this.$router.push({
|
|
|
- path:`/${currentPage}`
|
|
|
- })
|
|
|
- }
|
|
|
+ toDetail(e){
|
|
|
+ console.log(e)
|
|
|
+ },
|
|
|
+ // 查询进度
|
|
|
+ searchCompletionInfo(){
|
|
|
+ getObtainRoomcCompletionInformationList(this.searchParam).then(res => {
|
|
|
+ let info = []
|
|
|
+ info = res.data
|
|
|
+ info.forEach(e => {
|
|
|
+ e.roomStatusVoList = e.roomStatusVoList.reverse()
|
|
|
+ })
|
|
|
+ this.roomsInfo = info
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getAreaList(district) {
|
|
|
+ if (district === undefined || district == null || district === '')
|
|
|
+ return
|
|
|
+ console.log(getAreaList)
|
|
|
+ getAreaList({district: district}).then(res => this.areaList = res.data)
|
|
|
+ },
|
|
|
+ getBuildingList1(areaId) {
|
|
|
+ if (areaId === undefined || areaId == null || areaId === '')
|
|
|
+ return
|
|
|
+ getBuildingList({areaId: areaId}).then(res => this.buildingList = res.data)
|
|
|
+ },
|
|
|
+ getUnitList1(buildingId) {
|
|
|
+ if (buildingId === undefined || buildingId == null || buildingId === '')
|
|
|
+ return
|
|
|
+ getUnits(_, buildingId).then(res => this.unitList = res.data)
|
|
|
+ },
|
|
|
+ toModule(){
|
|
|
+ console.log(this.$router)
|
|
|
+ const currentPage = this.currentMenu == 0 ? 'material_statistics' : this.currentMenu == 1 ? 'progres_statistics' :this.currentMenu == 2 ? 'echarts_statistics': 'progres_visual'
|
|
|
+ this.$router.push({
|
|
|
+ path:`/${currentPage}`
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
@@ -186,6 +327,7 @@ export default {
|
|
|
justify-content: space-between;
|
|
|
width: 60%;
|
|
|
.searchBtn{
|
|
|
+ height: 100%;
|
|
|
width: 11%;
|
|
|
background-color: #1890FF;
|
|
|
color: #fff;
|
|
@@ -221,4 +363,36 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.buildingContain{
|
|
|
+ height: 100%;
|
|
|
+ border: 1px solid #000;
|
|
|
+ .unitFloor{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ .room{
|
|
|
+ width: 50px;
|
|
|
+ height: 25px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 25px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .unitFloor >div:not(:nth-child(1)){
|
|
|
+ margin-left: 2%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.buildingContain .unitFloor:not(:nth-child(1)){
|
|
|
+ margin-top: 2%;
|
|
|
+}
|
|
|
+::v-deep .searchForm{
|
|
|
+ display: flex;
|
|
|
+ .el-form-item{
|
|
|
+ width: 205px;
|
|
|
+ }
|
|
|
+ .el-select{
|
|
|
+ width: 135px;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|