|
|
@@ -1,904 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="buildingManagement">
|
|
|
- <div class="max-left-box">
|
|
|
- <div class="tree-box scrollbar-box">
|
|
|
- <div class="terr-max-box" v-for="(item,index) in treeList" :key="index">
|
|
|
- <div class="max-name-box">
|
|
|
- <p class="max-name" :class="checkTreeId==item.id?'check-color':''" @click="clickCheckTree(item.id,1)">{{item.name}}</p>
|
|
|
- <el-dropdown @command="(command)=>handleCommand(command,item)">
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_gd.png" style="cursor:pointer;width:16px;height:4px;margin-top:7px;">
|
|
|
- <el-dropdown-menu slot="dropdown">
|
|
|
- <el-dropdown-item command="1">编辑</el-dropdown-item>
|
|
|
- <el-dropdown-item command="2">删除</el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </el-dropdown>
|
|
|
- </div>
|
|
|
- <div class="terr-big-box" v-for="(itemOne,indexOne) in item.childList" :key="indexOne">
|
|
|
- <div class="big-name-box">
|
|
|
- <img v-if="!itemOne.type" src="@/assets/ZDimages/integratedManagement/icon_bjgl_jt.png" @click="terrClick(itemOne)">
|
|
|
- <img v-if="itemOne.type" src="@/assets/ZDimages/integratedManagement/icon_bjgl_xjt.png" @click="terrClick(itemOne)">
|
|
|
- <p :class="checkTreeId==itemOne.id?'check-color':''" @click="clickCheckTree(itemOne.id,2)">{{itemOne.name}}</p>
|
|
|
- </div>
|
|
|
- <div v-if="itemOne.type" class="terr-min-box" v-for="(itemTwo,indexTwo) in itemOne.childList" :key="indexTwo">
|
|
|
- <p class="min-name" :class="checkTreeId==itemTwo.id?'check-color':''" @click="clickCheckTree(itemTwo.id,3)">{{itemTwo.name}}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <p class="max-left-big-button" @click="handleCommand(3)">+ 新增校院</p>
|
|
|
- </div>
|
|
|
- <div class="max-right-box">
|
|
|
- <div class="school-box" v-if="checkTreeType == 1">
|
|
|
- <div class="max-right-button-box">
|
|
|
- <p class="null-p"></p>
|
|
|
- <p class="max-right-big-button" @click="handleCommand(4)">+ 新增楼栋</p>
|
|
|
- </div>
|
|
|
- <div class="right-big-list-box scrollbar-box">
|
|
|
- <div class="for-max-box" v-for="(item,index) in buildingList" :key="index"
|
|
|
- @dragover.prevent="dragoverPrevent(item)">
|
|
|
- <div class="for-big-box">
|
|
|
- <div class="for-big-box-left">
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_td.png" class="for-img-one"
|
|
|
- draggable="true"
|
|
|
- @dragstart="dragstartPlay($event)"
|
|
|
- @dragend="dragEnterOver($event, item)">
|
|
|
- <p class="for-text-one">{{item.name}}</p>
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_lcs.png" class="for-img-two">
|
|
|
- <div class="for-text-box-one">
|
|
|
- <p>6</p>
|
|
|
- <p>楼层数</p>
|
|
|
- </div>
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_fj.png" class="for-img-three">
|
|
|
- <div class="for-text-box-two">
|
|
|
- <p>160</p>
|
|
|
- <p>房间数</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="for-button-min-box">
|
|
|
- <div>
|
|
|
- <img src="@/assets/ZDimages/basicsModules/icon_znwl_bj.png">
|
|
|
- <p @click="handleCommand(8)">编辑</p>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/ZDimages/basicsModules/icon_znwl_sc.png">
|
|
|
- <p @click="handleCommand(9)">删除</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="building-box" v-if="checkTreeType == 2">
|
|
|
- <div class="max-right-button-box">
|
|
|
- <p class="null-p"></p>
|
|
|
- <p class="max-right-big-button" style="margin-right:20px;" @click="handleCommand(7)">+ 新增楼层</p>
|
|
|
- <p class="max-right-big-button" @click="floorZK(1)">{{floorZkType==1?'一键收起':'一键展开'}}</p>
|
|
|
- </div>
|
|
|
- <div class="right-big-list-box scrollbar-box">
|
|
|
- <div class="for-max-box" v-for="(item,index) in buildingList" :key="index"
|
|
|
- @dragover.prevent="dragoverPrevent(item)">
|
|
|
- <div class="for-big-box">
|
|
|
- <div class="for-big-box-left">
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_td.png" class="for-img-one"
|
|
|
- draggable="true"
|
|
|
- @dragstart="dragstartPlay($event)"
|
|
|
- @dragend="dragEnterOver($event, item)">
|
|
|
- <p class="for-text-one">{{item.name}}</p>
|
|
|
- </div>
|
|
|
- <div class="for-button-min-box">
|
|
|
- <div>
|
|
|
- <img src="@/assets/ZDimages/basicsModules/icon_znwl_bj.png">
|
|
|
- <p @click="handleCommand(8)">编辑</p>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/ZDimages/basicsModules/icon_znwl_sc.png">
|
|
|
- <p @click="handleCommand(9)">删除</p>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <img src="@/assets/ZDimages/integratedManagement/icon_bjgl_zk.png">
|
|
|
- <p @click="floorZK(2,index)">{{item.type?'收起':'展开'}}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <p v-if="item.type" style="border:1px solid #000;text-align: center;margin-left:36px;">暂无数据</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="floor-box" v-if="checkTreeType == 3">
|
|
|
- <div class="map-max-big-box">
|
|
|
- <p class="position-button-p">设置布局</p>
|
|
|
- </div>
|
|
|
- <div class="table-box">
|
|
|
- <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
- <el-form-item label="关键字" prop="searchValue" style="margin-right:20px;margin-bottom:20px;">
|
|
|
- <el-input
|
|
|
- v-model="queryParams.searchValue"
|
|
|
- placeholder="请输入关键字"
|
|
|
- clearable
|
|
|
- size="small"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间类型" prop="searchValue" style="margin-right:20px;margin-bottom:20px;">
|
|
|
- <el-input
|
|
|
- v-model="queryParams.searchValue"
|
|
|
- placeholder="请选择关键字"
|
|
|
- clearable
|
|
|
- size="small"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <p class="inquire-button-one" @click="handleQuery" style="margin-right:20px;margin-bottom:20px;">查询</p>
|
|
|
- <p class="reset-button-one" @click="resetQuery">重置</p>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <el-table v-loading="loading" border :data="dataList">
|
|
|
- <el-table-column label="房间号" align="left" prop="moldName" width="100"/>
|
|
|
- <el-table-column label="房间名称" align="left" prop="createBy"/>
|
|
|
- <el-table-column label="房间类型" align="left" prop="createBy" width="200"/>
|
|
|
- <el-table-column label="创建人" align="left" prop="createBy" width="200"/>
|
|
|
- <el-table-column label="创建时间" align="left" prop="createTime" width="200"/>
|
|
|
- <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="200">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div class="table-button-box">
|
|
|
- <p class="table-button-null"></p>
|
|
|
- <p class="table-button-p" @click="roomClick(1,item)">编辑</p>
|
|
|
- <p class="table-button-p" @click="roomClick(3)">删除</p>
|
|
|
- <p class="table-button-null"></p>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <pagination
|
|
|
- style="margin-top:20px;"
|
|
|
- v-show="total>0"
|
|
|
- :total="total"
|
|
|
- :page.sync="queryParams.pageNum"
|
|
|
- :limit.sync="queryParams.pageSize"
|
|
|
- @pagination="getList"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 新增/编辑院校 -->
|
|
|
- <el-dialog :title="dialogTitle" v-if="dialogOpen" :visible.sync="dialogOpen" width="600px" append-to-body>
|
|
|
- <el-form ref="dialogForm" :model="dialogForm" :rules="rules" label-width="110px">
|
|
|
- <el-form-item label="院校名称：" prop="nameOne">
|
|
|
- <el-input v-model="dialogForm.nameOne" maxlength="10" placeholder="请输入院校名称" :disabled="dialogType==2 || dialogType==3"/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="楼栋名称：" prop="nameTwo" v-if="dialogType==2 || dialogType==3">
|
|
|
- <el-input v-model="dialogForm.nameTwo" maxlength="10" placeholder="请输入楼栋名称" :disabled="dialogType==3"/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="楼层名称：" prop="nameThree" v-if="dialogType==3">
|
|
|
- <el-input v-model="dialogForm.nameThree" maxlength="10" placeholder="请输入楼层名称" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="排序序号：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入排序序号" />
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div slot="footer" class="dialog-footer dialog-footer-box">
|
|
|
- <p class="dialog-footer-button-null"></p>
|
|
|
- <p class="dialog-footer-button-info" @click="cancel">取消</p>
|
|
|
- <p class="dialog-footer-button-primary" @click="submitForm">提交</p>
|
|
|
- <p class="dialog-footer-button-null"></p>
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- <el-dialog title="房间配置" v-if="dialogOpenRoom" :visible.sync="dialogOpenRoom" width="600px" append-to-body>
|
|
|
- <el-form ref="dialogForm" :model="dialogForm" :rules="rules" label-width="110px">
|
|
|
- <el-form-item label="楼栋名称：" prop="nameTwo">
|
|
|
- <el-input v-model="dialogForm.nameTwo" maxlength="10" placeholder="请输入楼栋名称" disabled/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="楼层名称：" prop="nameThree">
|
|
|
- <el-input v-model="dialogForm.nameThree" maxlength="10" placeholder="请输入楼层名称" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间类型：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入房间类型" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间号：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入房间号" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间名称：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入房间名称" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间选择：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入房间选择" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="房间位置：" prop="key">
|
|
|
- <el-input v-model="dialogForm.key" maxlength="10" placeholder="请输入房间位置" />
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div slot="footer" class="dialog-footer dialog-footer-box">
|
|
|
- <p class="dialog-footer-button-null"></p>
|
|
|
- <p class="dialog-footer-button-info" @click="cancel">取消</p>
|
|
|
- <p class="dialog-footer-button-primary" @click="submitForm">提交</p>
|
|
|
- <p class="dialog-footer-button-null"></p>
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- export default {
|
|
|
- name: "buildingManagement",
|
|
|
- data() {
|
|
|
- return {
|
|
|
- //拖拽起始Y点(用于计算朝向)
|
|
|
- clientY:null,
|
|
|
- clientId:null,
|
|
|
- treeList:[
|
|
|
- {
|
|
|
- id:'1',
|
|
|
- name:'西安电子科技大学东校区',
|
|
|
- childList:[
|
|
|
- {
|
|
|
- id:'2',
|
|
|
- name:'一号实验楼',
|
|
|
- type:false,
|
|
|
- childList:[
|
|
|
- {
|
|
|
- id:'3',
|
|
|
- name:'二层',
|
|
|
- childList:[]
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id:'4',
|
|
|
- name:'一号实验楼',
|
|
|
- type:false,
|
|
|
- childList:[
|
|
|
- {
|
|
|
- id:'5',
|
|
|
- name:'二层',
|
|
|
- childList:[]
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- ]
|
|
|
- }
|
|
|
- ],
|
|
|
- //选中状态
|
|
|
- checkTreeId:1,
|
|
|
- checkTreeType:1,
|
|
|
- buildingList:[
|
|
|
- {id:1,name:"名称1",type:false},{id:2,name:"名称2",type:true},{id:3,name:"名称3",type:false},{id:4,name:"名称1",type:false},{id:5,name:"名称2",type:true},{id:6,name:"名称3",type:false},{id:7,name:"名称1",type:false},{id:8,name:"名称2",type:true},{id:9,name:"名称3",type:false},
|
|
|
- ],
|
|
|
- //楼层展开/关闭状态
|
|
|
- floorZkType:null, //1.全部展开 2.全部关闭 3.有关有开
|
|
|
- //编辑弹窗开关
|
|
|
- dialogOpen:false,
|
|
|
- dialogType:null,
|
|
|
- dialogTitle:'',
|
|
|
- // 表单参数
|
|
|
- dialogForm: {},
|
|
|
- // 表单校验
|
|
|
- rules: {
|
|
|
- nameOne: [
|
|
|
- { required: true, message: "请输入院校名称", trigger: "blur" },
|
|
|
- { required: true, message: "请输入院校名称", validator: this.spaceJudgment, trigger: "blur" }
|
|
|
- ],
|
|
|
- nameTwo: [
|
|
|
- { required: true, message: "请输入楼栋名称", trigger: "blur" },
|
|
|
- { required: true, message: "请输入楼栋名称", validator: this.spaceJudgment, trigger: "blur" }
|
|
|
- ],
|
|
|
- nameThree: [
|
|
|
- { required: true, message: "请输入楼层名称", trigger: "blur" },
|
|
|
- { required: true, message: "请输入楼层名称", validator: this.spaceJudgment, trigger: "blur" }
|
|
|
- ],
|
|
|
- key: [
|
|
|
- { required: true, message: "请输入排序序号", trigger: "blur" },
|
|
|
- { required: true, message: "请输入排序序号", validator: this.spaceJudgment, trigger: "blur" }
|
|
|
- ],
|
|
|
- },
|
|
|
- // 显示搜索条件
|
|
|
- showSearch: true,
|
|
|
- loading:false,
|
|
|
- //楼层查询数据
|
|
|
- queryParams:{},
|
|
|
- //楼层表单数据
|
|
|
- dataList:[],
|
|
|
- total:10,
|
|
|
- //房间配置相关
|
|
|
- dialogOpenRoom:false,
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
-
|
|
|
- },
|
|
|
- mounted(){
|
|
|
- this.floorZkFor();
|
|
|
- },
|
|
|
- methods:{
|
|
|
- //房间操作按钮
|
|
|
- roomClick(type){
|
|
|
- if(type == 1){
|
|
|
- this.dialogOpenRoom = true;
|
|
|
- }else if(type == 2){
|
|
|
- this.$confirm('确定要删除该房间吗?', "警告", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning"
|
|
|
- }).then(function() {
|
|
|
- }).then(() => {
|
|
|
- }).catch(() => {});
|
|
|
- }else if(type == 3){
|
|
|
- this.dialogOpenRoom = true;
|
|
|
- }
|
|
|
- },
|
|
|
- //楼栋弹出下啦列表选中事件
|
|
|
- handleCommand(command,item){
|
|
|
- if (command == 1){
|
|
|
- //编辑院校
|
|
|
- this.$set(this,'dialogTitle','编辑院校');
|
|
|
- this.$set(this,'dialogType',1);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 2){
|
|
|
- //删除院校
|
|
|
- this.$confirm('确定要删除该院校吗?', "警告", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning"
|
|
|
- }).then(function() {
|
|
|
- }).then(() => {
|
|
|
- }).catch(() => {});
|
|
|
- }else if(command == 3){
|
|
|
- //新增院校
|
|
|
- this.$set(this,'dialogTitle','新增院校');
|
|
|
- this.$set(this,'dialogType',1);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 4){
|
|
|
- //新增楼栋
|
|
|
- this.$set(this,'dialogTitle','新增楼栋');
|
|
|
- this.$set(this,'dialogType',2);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 5){
|
|
|
- //编辑楼栋
|
|
|
- this.$set(this,'dialogTitle','编辑楼栋');
|
|
|
- this.$set(this,'dialogType',2);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 6){
|
|
|
- //删除楼栋
|
|
|
- this.$confirm('确定要删除该楼栋吗?', "警告", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning"
|
|
|
- }).then(function() {
|
|
|
- }).then(() => {
|
|
|
- }).catch(() => {});
|
|
|
- }else if(command == 7){
|
|
|
- //新增楼层
|
|
|
- this.$set(this,'dialogTitle','新增楼层');
|
|
|
- this.$set(this,'dialogType',3);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 8){
|
|
|
- //编辑楼层
|
|
|
- this.$set(this,'dialogTitle','编辑楼层');
|
|
|
- this.$set(this,'dialogType',3);
|
|
|
- this.$set(this,'dialogOpen',true);
|
|
|
- }else if(command == 9){
|
|
|
- //删除楼层
|
|
|
- this.$confirm('确定要删除该楼层吗?', "警告", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning"
|
|
|
- }).then(function() {
|
|
|
- }).then(() => {
|
|
|
- }).catch(() => {});
|
|
|
- }
|
|
|
- },
|
|
|
- //树状结构选中
|
|
|
- clickCheckTree(id,type){
|
|
|
- this.$set(this,'checkTreeId',id)
|
|
|
- this.$set(this,'checkTreeType',type)
|
|
|
- },
|
|
|
- // 取消按钮
|
|
|
- cancel() {
|
|
|
- this.$set(this,'dialogOpen',false);
|
|
|
- this.$set(this,'dialogForm',{});
|
|
|
- this.$set(this,'dialogType',null);
|
|
|
- },
|
|
|
- //确定按钮
|
|
|
- submitForm(){
|
|
|
-
|
|
|
- },
|
|
|
- //树状结构展开收回
|
|
|
- terrClick(itemOne){
|
|
|
- itemOne.type = !itemOne.type;
|
|
|
- },
|
|
|
- //展开/收起开关
|
|
|
- floorZK(type,index){
|
|
|
- let self = this;
|
|
|
- //type等于1时全部开关功能 等于2时单个开关
|
|
|
- if(type == 1){
|
|
|
- let list = JSON.parse(JSON.stringify(self.buildingList))
|
|
|
- for(let i=0;i<list.length;i++){
|
|
|
- if(self.floorZkType == 1){
|
|
|
- list[i].type = false;
|
|
|
- }else if(self.floorZkType == 2){
|
|
|
- list[i].type = true;
|
|
|
- }else if(self.floorZkType == 3){
|
|
|
- list[i].type = true;
|
|
|
- }
|
|
|
- }
|
|
|
- this.$set(this,'buildingList',list);
|
|
|
- this.floorZkFor();
|
|
|
- }else if(type == 2){
|
|
|
- this.$set(this.buildingList[index],'type',this.buildingList[index].type?false:true)
|
|
|
- this.floorZkFor();
|
|
|
- }
|
|
|
- },
|
|
|
- //层展开关闭判断
|
|
|
- floorZkFor(){
|
|
|
- let self = this;
|
|
|
- let numOne = 0;
|
|
|
- let numTwo = 0;
|
|
|
- for(let i=0;i<self.buildingList.length;i++){
|
|
|
- if(self.buildingList[i].type){
|
|
|
- numOne++
|
|
|
- }else{
|
|
|
- numTwo++
|
|
|
- }
|
|
|
- }
|
|
|
- if(numOne == self.buildingList.length){
|
|
|
- this.$set(this,'floorZkType',1);
|
|
|
- }else if(numTwo == self.buildingList.length){
|
|
|
- this.$set(this,'floorZkType',2);
|
|
|
- }else{
|
|
|
- this.$set(this,'floorZkType',3);
|
|
|
- }
|
|
|
- },
|
|
|
- //拖拽抓取时触发
|
|
|
- dragstartPlay(event) {
|
|
|
- this.$set(this,'clientY',event.clientY)
|
|
|
- },
|
|
|
- //拖拽途径触发
|
|
|
- dragoverPrevent(item){
|
|
|
- this.$set(this,'clientId',item.id)
|
|
|
- },
|
|
|
- //拖拽释放触发
|
|
|
- dragEnterOver(event,item) {
|
|
|
- let self = this;
|
|
|
- if(this.clientId && item.id != this.clientId){
|
|
|
- let list = [];
|
|
|
- let obj = null;
|
|
|
- for(let i=0;i<self.buildingList.length;i++){
|
|
|
- if(self.buildingList[i].id == item.id){
|
|
|
- obj = JSON.parse(JSON.stringify(self.buildingList[i]))
|
|
|
- }
|
|
|
- }
|
|
|
- if(event.clientY>this.clientY){
|
|
|
- for(let i=0;i<self.buildingList.length;i++){
|
|
|
- if(self.buildingList[i].id != item.id && self.buildingList[i].id != this.clientId){
|
|
|
- list.push(self.buildingList[i]);
|
|
|
- }else if(self.buildingList[i].id == this.clientId){
|
|
|
- list.push(self.buildingList[i]);
|
|
|
- list.push(obj);
|
|
|
- }
|
|
|
- }
|
|
|
- }else if(event.clientY<this.clientY){
|
|
|
- for(let i=0;i<self.buildingList.length;i++){
|
|
|
- if(self.buildingList[i].id == this.clientId){
|
|
|
- list.push(obj);
|
|
|
- list.push(self.buildingList[i]);
|
|
|
- }else if(self.buildingList[i].id != item.id && self.buildingList[i].id != this.clientId){
|
|
|
- list.push(self.buildingList[i]);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- this.$set(this,'buildingList',list);
|
|
|
- this.$set(this,'clientId',null);
|
|
|
- }
|
|
|
- },
|
|
|
- getList(){
|
|
|
-
|
|
|
- },
|
|
|
- /** 搜索按钮操作 */
|
|
|
- handleQuery() {
|
|
|
- this.queryParams.pageNum = 1;
|
|
|
- this.getList();
|
|
|
- },
|
|
|
- /** 重置按钮操作 */
|
|
|
- resetQuery() {
|
|
|
- // this.resetForm("queryForm");
|
|
|
- this.$set(this,'queryParams',{
|
|
|
- pageNum: 1,
|
|
|
- pageSize:20,
|
|
|
- typeName:"",
|
|
|
- title: '',
|
|
|
- });
|
|
|
- this.handleQuery();
|
|
|
- },
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
- .buildingManagement{
|
|
|
- flex:1;
|
|
|
- display: flex!important;
|
|
|
- overflow: hidden;
|
|
|
- padding:22px 28px 22px 32px;
|
|
|
- *{
|
|
|
- margin:0;
|
|
|
- font-weight:100;
|
|
|
- }
|
|
|
- .max-left-box{
|
|
|
- width:281px;
|
|
|
- border-right:1px dashed #A2A2A2;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- .tree-box{
|
|
|
- flex:1;
|
|
|
- .terr-max-box{
|
|
|
- .max-name-box{
|
|
|
- display: flex;
|
|
|
- margin-right:20px;
|
|
|
- margin-bottom:10px;
|
|
|
- color:#D8D8D8;
|
|
|
- font-size:20px;
|
|
|
- .max-name{
|
|
|
- flex:1;
|
|
|
- margin-right:19px;
|
|
|
- color:#333;
|
|
|
- font-size:16px;
|
|
|
- line-height:16px;
|
|
|
- margin-top:3px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
- .terr-big-box{
|
|
|
- margin-left:30px;
|
|
|
- .big-name-box{
|
|
|
- cursor: pointer;
|
|
|
- height:40px;
|
|
|
- line-height:40px;
|
|
|
- display: flex;
|
|
|
- font-size:16px;
|
|
|
- color:#333;
|
|
|
- img{
|
|
|
- width:16px;
|
|
|
- height:16px;
|
|
|
- margin-top:12px;
|
|
|
- margin-right:4px;
|
|
|
- }
|
|
|
- }
|
|
|
- .terr-min-box{
|
|
|
- margin-left:30px;
|
|
|
- .min-name{
|
|
|
- cursor: pointer;
|
|
|
- height:40px;
|
|
|
- line-height:40px;
|
|
|
- display: flex;
|
|
|
- font-size:16px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .check-color{
|
|
|
- color:#0183FA!important;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .max-left-big-button{
|
|
|
- color:#0183FA;
|
|
|
- border:1px dashed #0183FA;
|
|
|
- -webkit-border-radius: 6px;
|
|
|
- -moz-border-radius: 6px;
|
|
|
- border-radius: 6px;
|
|
|
- width:180px;
|
|
|
- line-height:40px;
|
|
|
- margin: 20px 0 20px 40px;
|
|
|
- text-align: center;
|
|
|
- font-size:14px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .max-left-big-button:hover{
|
|
|
- color:#fff;
|
|
|
- background: #0183FA;
|
|
|
- border:1px solid #0183FA;
|
|
|
- }
|
|
|
- }
|
|
|
- .max-right-box{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- .school-box{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- .max-right-button-box{
|
|
|
- height:40px;
|
|
|
- display: flex;
|
|
|
- margin-bottom:22px;
|
|
|
- .null-p{
|
|
|
- flex:1;
|
|
|
- }
|
|
|
- .max-right-big-button{
|
|
|
- color:#fff;
|
|
|
- background: #0045AF;
|
|
|
- -webkit-border-radius: 6px;
|
|
|
- -moz-border-radius: 6px;
|
|
|
- border-radius: 6px;
|
|
|
- width:130px;
|
|
|
- line-height:40px;
|
|
|
- text-align: center;
|
|
|
- font-size:14px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .max-right-big-button:hover{
|
|
|
- color:#fff;
|
|
|
- background: #0183FA;
|
|
|
- }
|
|
|
- }
|
|
|
- .right-big-list-box{
|
|
|
- flex:1;
|
|
|
- .for-max-box{
|
|
|
- .for-big-box{
|
|
|
- display: flex;
|
|
|
- border:1px solid #dedede;
|
|
|
- height:100px;
|
|
|
- box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.16);
|
|
|
- margin-bottom:30px;
|
|
|
- margin-left:36px;
|
|
|
- border-radius:6px;
|
|
|
- .for-big-box-left{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- .for-img-one{
|
|
|
- cursor: pointer;
|
|
|
- height:30px;
|
|
|
- width:30px;
|
|
|
- margin:35px 0 0 30px;
|
|
|
- }
|
|
|
- .for-text-one{
|
|
|
- font-size:16px;
|
|
|
- line-height:100px;
|
|
|
- margin-left:95px;
|
|
|
- width:230px;
|
|
|
- font-weight:500;
|
|
|
- }
|
|
|
- .for-img-two{
|
|
|
- height:48px;
|
|
|
- width:48px;
|
|
|
- margin:26px 23px 0 30px;
|
|
|
- }
|
|
|
- .for-text-box-one{
|
|
|
- width:88px;
|
|
|
- margin-right:73px;
|
|
|
- p{
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- p:nth-child(1){
|
|
|
- margin-top:20px;
|
|
|
- font-size:24px;
|
|
|
- line-height:30px;
|
|
|
- color:#0183FA;
|
|
|
- }
|
|
|
- p:nth-child(2){
|
|
|
- margin-top:10px;
|
|
|
- font-size:16px;
|
|
|
- line-height:16px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- .for-img-three{
|
|
|
- height:48px;
|
|
|
- width:48px;
|
|
|
- margin:26px 23px 0 0;
|
|
|
- }
|
|
|
- .for-text-box-two{
|
|
|
- width:88px;
|
|
|
- p{
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- p:nth-child(1){
|
|
|
- margin-top:20px;
|
|
|
- font-size:24px;
|
|
|
- line-height:30px;
|
|
|
- color:#0183FA;
|
|
|
- }
|
|
|
- p:nth-child(2){
|
|
|
- margin-top:10px;
|
|
|
- font-size:16px;
|
|
|
- line-height:16px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .for-button-min-box{
|
|
|
- width:220px;
|
|
|
- margin-top:9px;
|
|
|
- height:82px;
|
|
|
- border-left:1px dashed rgba(0,0,0,0.3);
|
|
|
- display: flex;
|
|
|
- line-height:82px;
|
|
|
- div{
|
|
|
- margin-left: 34px;
|
|
|
- display: flex;
|
|
|
- width: 60px;
|
|
|
- cursor: pointer;
|
|
|
- img{
|
|
|
- width:16px;
|
|
|
- height:16px;
|
|
|
- margin-right:8px;
|
|
|
- margin-top:33px;
|
|
|
- }
|
|
|
- p{
|
|
|
- font-size:14px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .building-box{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- .max-right-button-box{
|
|
|
- height:40px;
|
|
|
- display: flex;
|
|
|
- margin-bottom:22px;
|
|
|
- .null-p{
|
|
|
- flex:1;
|
|
|
- }
|
|
|
- .max-right-big-button{
|
|
|
- color:#fff;
|
|
|
- background: #0045AF;
|
|
|
- -webkit-border-radius: 6px;
|
|
|
- -moz-border-radius: 6px;
|
|
|
- border-radius: 6px;
|
|
|
- width:130px;
|
|
|
- line-height:40px;
|
|
|
- text-align: center;
|
|
|
- font-size:14px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .max-right-big-button:hover{
|
|
|
- color:#fff;
|
|
|
- background: #0183FA;
|
|
|
- }
|
|
|
- }
|
|
|
- .right-big-list-box{
|
|
|
- flex:1;
|
|
|
- .for-max-box{
|
|
|
- margin-bottom:30px;
|
|
|
- .for-big-box{
|
|
|
- display: flex;
|
|
|
- border:1px solid #dedede;
|
|
|
- height:100px;
|
|
|
- box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.16);
|
|
|
- margin-left:36px;
|
|
|
- border-radius:6px;
|
|
|
- .for-big-box-left{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- .for-img-one{
|
|
|
- cursor: pointer;
|
|
|
- height:30px;
|
|
|
- width:30px;
|
|
|
- margin:35px 0 0 30px;
|
|
|
- }
|
|
|
- .for-text-one{
|
|
|
- font-size:16px;
|
|
|
- line-height:100px;
|
|
|
- margin-left:95px;
|
|
|
- width:230px;
|
|
|
- font-weight:500;
|
|
|
- }
|
|
|
- .for-img-two{
|
|
|
- height:48px;
|
|
|
- width:48px;
|
|
|
- margin:26px 23px 0 30px;
|
|
|
- }
|
|
|
- .for-text-box-one{
|
|
|
- width:88px;
|
|
|
- margin-right:73px;
|
|
|
- p{
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- p:nth-child(1){
|
|
|
- margin-top:20px;
|
|
|
- font-size:24px;
|
|
|
- line-height:30px;
|
|
|
- color:#0183FA;
|
|
|
- }
|
|
|
- p:nth-child(2){
|
|
|
- margin-top:10px;
|
|
|
- font-size:16px;
|
|
|
- line-height:16px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- .for-img-three{
|
|
|
- height:48px;
|
|
|
- width:48px;
|
|
|
- margin:26px 23px 0 0;
|
|
|
- }
|
|
|
- .for-text-box-two{
|
|
|
- width:88px;
|
|
|
- p{
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- p:nth-child(1){
|
|
|
- margin-top:20px;
|
|
|
- font-size:24px;
|
|
|
- line-height:30px;
|
|
|
- color:#0183FA;
|
|
|
- }
|
|
|
- p:nth-child(2){
|
|
|
- margin-top:10px;
|
|
|
- font-size:16px;
|
|
|
- line-height:16px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .for-button-min-box{
|
|
|
- width:330px;
|
|
|
- margin-top:9px;
|
|
|
- height:82px;
|
|
|
- border-left:1px dashed rgba(0,0,0,0.3);
|
|
|
- display: flex;
|
|
|
- line-height:82px;
|
|
|
- div{
|
|
|
- margin-left: 34px;
|
|
|
- display: flex;
|
|
|
- width: 60px;
|
|
|
- cursor: pointer;
|
|
|
- img{
|
|
|
- width:16px;
|
|
|
- height:16px;
|
|
|
- margin-right:8px;
|
|
|
- margin-top:33px;
|
|
|
- }
|
|
|
- p{
|
|
|
- font-size:14px;
|
|
|
- color:#333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .floor-box{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- .map-max-big-box{
|
|
|
- height:400px;
|
|
|
- position:relative;
|
|
|
- border:1px solid #E0E0E0;
|
|
|
- margin-bottom:20px;
|
|
|
- margin-left:36px;
|
|
|
- .position-button-p{
|
|
|
- position:absolute;
|
|
|
- right:12px;
|
|
|
- top:13px;
|
|
|
- width:100px;
|
|
|
- line-height:40px;
|
|
|
- font-size:14px;
|
|
|
- color:#fff;
|
|
|
- background: #0045AF;
|
|
|
- border-radius:6px;
|
|
|
- text-align: center;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
- .table-box{
|
|
|
- margin-left:36px;
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|
dedsudiyu