123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107 |
- /**
- *@author:Guoxiaohuan
- *@date:2020.06.08
- *@info 机房信息主页
- */
- <template>
- <div class='compute-box'>
- <el-dialog :title='`${systemName}`||"机房"' :visible.sync='visible' :fullscreen='true'>
- <div class='compute-span'></div>
- <el-tooltip class='item' effect='dark' :content='content' placement='top' v-if='smsxtArr.length>0'>
- <div class='compute-zf' @click='jumpFloor'></div>
- </el-tooltip>
- <div class='compute-tab'>
- <el-tabs v-model='activeName' @tab-click='handleClick' ref='elTabs'>
- <el-tab-pane label='机房布置图' name='1' v-if='tableImg.length>0'>
- <room-table1 v-if='tableImg.length>=0' :tableImg='tableImg'></room-table1>
- </el-tab-pane>
- <el-tab-pane label='配电室低压柜及出线明细表' name='2' v-if='systemName=="配电室机房"'>
- <div class='compute-center'>
- <Select
- width='200'
- @change='Index1'
- v-model='floor2'
- tipPlace='top'
- caption='楼层:'
- :selectdata='floorSelect'
- :placeholder='"请选择"'
- style='margin-right:12px'
- ></Select>
- <el-input
- clearable
- @change='Index1'
- v-model='ctbhInput'
- placeholder='搜索抽屉编号'
- size='small'
- prefix-icon='el-icon-search'
- style='width:200px;margin-right:12px'
- ></el-input>
- <el-input
- clearable
- @change='Index1'
- v-model='cxggInput'
- placeholder='搜索出线规格'
- size='small'
- prefix-icon='el-icon-search'
- style='width:200px;margin-right:12px'
- ></el-input>
- <el-input
- clearable
- @change='Index1'
- v-model='djbhInput'
- placeholder='搜索电井编号'
- size='small'
- prefix-icon='el-icon-search'
- style='width:200px;margin-right:12px'
- ></el-input>
- <el-input
- clearable
- @change='Index1'
- v-model='kzhlInput'
- placeholder='搜索控制回路'
- size='small'
- prefix-icon='el-icon-search'
- style='width:200px;margin-right:12px'
- ></el-input>
- </div>
- <room-table2
- v-if='table2.length>=0'
- :table2='table2'
- :loading='loading1'
- :page='page1'
- :total='total1'
- :size='size1'
- @Index1Emit='Index1Emit'
- ></room-table2>
- </el-tab-pane>
- <el-tab-pane label='机房内核心设备' name='3'>
- <div class='compute-center'>
- <el-input
- clearable
- placeholder='搜索设备简称'
- size='small'
- prefix-icon='el-icon-search'
- v-model='sbjcInput'
- @change='Index2'
- style='width:200px;margin-right:12px'
- ></el-input>
- <el-input
- clearable
- @change='Index2'
- placeholder='搜索品牌、型号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='ppxhInput'
- style='width:200px;margin-right:12px'
- ></el-input>
- <Select
- width='200'
- @change='Index2'
- tipPlace='top'
- v-model='floorChange'
- caption='楼层:'
- :selectdata='floorSelect'
- :placeholder='"请选择"'
- style='margin-right:12px'
- ></Select>
- <el-input
- clearable
- @change='Index2'
- placeholder='搜索生产厂商'
- size='small'
- prefix-icon='el-icon-search'
- v-model='sccsInput'
- style='width:200px;margin-right:12px'
- ></el-input>
- </div>
- <room-table3
- v-if='table3.length>=0'
- :table3='table3'
- :loading='loading2'
- :page='page2'
- :total='total2'
- :size='size2'
- :floorChange='floorChange'
- @Index2Emit='Index2Emit'
- ></room-table3>
- </el-tab-pane>
- <el-tab-pane label='维修记录' name='4'>
- <div class='compute-center'>
- <el-input
- clearable
- @change='Index3'
- placeholder='搜索设备名称、编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='sbmcInput4'
- style='width:200px;margin-right:12px'
- ></el-input>
- <el-input
- clearable
- @change='Index3'
- placeholder='搜索重要事项记录、描述'
- size='small'
- prefix-icon='el-icon-search'
- v-model='zysxInput4'
- style='width:200px;margin-right:12px'
- ></el-input>
- <Select
- @change='Index3'
- width='200'
- tipPlace='top'
- caption='是否更换:'
- v-model='sfghSelect'
- :selectdata='isReplaceData'
- :placeholder='"请选择"'
- style='margin-right:12px'
- ></Select>
- <el-input
- clearable
- @change='Index3'
- placeholder='搜索工单编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='gdbhInput4'
- style='width:200px;margin-right:12px'
- ></el-input>
- <div class='picker-box'>
- <span class='picker-span'>填报日期:</span>
- <el-date-picker
- style='width:190px'
- v-model='tbsjDate'
- value-format='yyyyMMdd'
- type='daterange'
- @change='Index3'
- size='mini'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </div>
- <!-- <p class='input-dialog-p'>填报日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- v-model='tbsjDate'
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- style='margin-right:12px;width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </p>-->
- </div>
- <div class='dialog-none'>
- <div class='input-dialog'>
- <div class='input-dialog-top' @click='show'>
- <img src='@/assets/imgs/select.png' />
- 筛选
- </div>
- <div class='input-dialog-form' v-if='dialogFormVisible'>
- <p class='input-dialog-p'>验收日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- v-model='yssjDate'
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- style='margin-right:12px;width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </p>
- <!-- <p class='input-dialog-p'>工单编号</p>
- <p class='input-dialog-p2'>
- <el-input
- clearable
- placeholder
- style='width:200px;'
- size='mini'
- prefix-icon='el-icon-search'
- v-model='gdbhInput4'
- ></el-input>
- </p>-->
- <p class='input-dialog-foot'>
- <el-button @click='dialogFormVisible = false' size='mini'>取 消</el-button>
- <el-button type='primary' @click='confirm
- ' size='mini'>确 定</el-button>
- </p>
- </div>
- </div>
- </div>
- <room-table4
- v-if='table4.length>=0'
- :table4='table4'
- :loading='loading3'
- :page='page3'
- :total='total3'
- :size='size3'
- @Index3Emit='Index3Emit'
- ></room-table4>
- </el-tab-pane>
- <el-tab-pane label='维保记录' name='5'>
- <div class='compute-center'>
- <el-input
- @change='Index4'
- clearable
- placeholder='搜索设备名称、编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='sbmcInput5'
- style='margin-right:12px;width:220px;'
- ></el-input>
- <el-input
- @change='Index4'
- clearable
- placeholder='搜索核心维保事项记录描述'
- size='small'
- prefix-icon='el-icon-search'
- v-model='wbsxjlInput5'
- style='margin-right:12px;width:220px;'
- ></el-input>
- <el-input
- @change='Index4'
- clearable
- placeholder='搜索任务编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='rwbhInput5'
- style='margin-right:12px;width:220px;'
- ></el-input>
- <Select
- @change='Index4'
- width='220'
- tipPlace='top'
- v-model='statuSelect5'
- caption='任务状态:'
- v-if='status.length>0'
- :selectdata='status'
- :placeholder='"请选择"'
- style='margin-right:12px'
- ></Select>
- <Select
- width='220'
- tipPlace='top'
- v-model='iszcSelect5'
- caption='是否正常:'
- v-if='zt.length>0'
- :selectdata='zt'
- :placeholder='"请选择"'
- style='margin-right:12px'
- ></Select>
- </div>
- <div class='dialog-none'>
- <div class='input-dialog'>
- <div class='input-dialog-top' @click='show'>
- <img src='@/assets/imgs/select.png' />
- 筛选
- </div>
- <div class='input-dialog-form' v-if='dialogFormVisible'>
- <p class='input-dialog-p'>任务开始日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- v-model='rwksrq'
- style='width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </p>
- <p class='input-dialog-p'>任务完成日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- v-model='rwwcrq'
- style='width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </p>
- <!-- <el-input
- @change='Index4'
- clearable
- placeholder='异常工单编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='ycgdbhInput5'
- style='margin-right:12px;width:220px;'
- ></el-input>-->
- <p class='input-dialog-p'>异常工单编号</p>
- <p class='input-dialog-p2'>
- <el-input
- clearable
- placeholder='异常工单编号'
- size='small'
- prefix-icon='el-icon-search'
- v-model='ycgdbhInput5'
- style='width:200px;'
- ></el-input>
- </p>
- <p class='input-dialog-p'>异常工单填报日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- v-model='ycgdtbsj'
- style='width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- ></el-date-picker>
- </p>
- <p class='input-dialog-p'>异常工单验收日期</p>
- <p class='input-dialog-p2'>
- <el-date-picker
- clearable
- value-format='yyyyMMdd'
- type='daterange'
- size='mini'
- style='width:200px'
- range-separator='-'
- start-placeholder
- end-placeholder
- v-model='ycgdyssj'
- ></el-date-picker>
- </p>
- <p class='input-dialog-foot'>
- <el-button @click='dialogFormVisible = false' size='mini'>取 消</el-button>
- <el-button type='primary' @click='confirm2' size='mini'>确 定</el-button>
- </p>
- </div>
- </div>
- </div>
- <room-table5
- v-if='table5.length>=0'
- :table5='table5'
- :loading='loading4'
- :page='page4'
- :total='total4'
- :size='size4'
- @Index4Emit='Index4Emit'
- ></room-table5>
- </el-tab-pane>
- </el-tabs>
- </div>
- </el-dialog>
- </div>
- </template>
- <script>
- import { queryEquipmentList } from '@/api/equipmentList.js'
- import { queryDygjcxline, queryHxsb, queryWxjf, queryWb, querySystem } from '@/api/room.js'
- import roomTable1 from './room1'
- import roomTable2 from './room2'
- import roomTable3 from './room3'
- import roomTable4 from './room4'
- import roomTable5 from './room5'
- import { mapGetters } from 'vuex'
- import { querySelect, queryPic } from '@/api/public.js'
- import { Select } from 'meri-design'
- export default {
- data() {
- return {
- content: '',
- activeName: '1',
- location: '',
- visible: false,
- dialogFormVisible: false,
- systemName: '',
- loading: true,
- loading1: true,
- loading2: true,
- loading3: true,
- loading4: true,
- table2: [],
- table3: [],
- table4: [],
- table5: [],
- //
- total: 0,
- page: 1,
- size: 10,
- picFloor: '',
- tableImg: [],
- //
- total1: 0,
- page1: 1,
- size1: 10,
- floor2: '',
- ctbhInput: '',
- cxggInput: '',
- djbhInput: '',
- kzhlInput: '',
- //
- total2: 0,
- page2: 1,
- size2: 10,
- sccsInput: '',
- ppxhInput: '',
- sbjcInput: '',
- floorChange: '',
- //
- total3: 0,
- page3: 1,
- size3: 11,
- tbsjDate: '',
- yssjDate: '',
- // 是否更换配件
- isReplaceData: [
- { id: '1', name: '是' },
- { id: '0', name: '否' }
- ],
- sfghSelect: '',
- sbmcInput4: '',
- sbbhInput4: '',
- zysxInput4: '',
- msInput4: '',
- gdbhInput4: '',
- type1: 'wx',
- //
- total4: 0,
- page4: 1,
- size4: 11,
- searVal: '',
- status: [],
- zt: [],
- sbmcInput5: '',
- sbbhInput5: '',
- wbsxjlInput5: '',
- rwbhInput5: '',
- ycgdbhInput5: '',
- ssmsInput5: '',
- iszcSelect5: '',
- statuSelect5: '',
- rwksrq: '',
- rwwcrq: '',
- ycgdtbsj: '',
- ycgdyssj: '',
- smsxtArr: { smsx: '1001', smsxtname: '供电系统' }
- }
- },
- components: {
- roomTable1,
- roomTable2,
- roomTable3,
- roomTable4,
- roomTable5
- },
- computed: {
- ...mapGetters(['floorSelect', 'plazaId'])
- },
- methods: {
- handleClick(tab) {
- if (tab.label == '机房布置图') {
- this.Index(this.smsxtArr.smsxt)
- } else if (tab.label == '配电室低压柜及出线明细表') {
- this.Index1()
- } else if (tab.label == '机房内核心设备') {
- this.Index2()
- } else if (tab.label == '维修记录') {
- this.Index3()
- } else if (tab.label == '维保记录') {
- this.Index4()
- this.changeSelect()
- }
- },
- // 右上角的筛选点击按钮
- show() {
- this.dialogFormVisible = !this.dialogFormVisible
- },
- Index(system) {
- this.picFloor = this.$cookie.get('floorNow')
- let getParams = {
- typename: '位置布置图',
- location: this.location,
- module: '1002',
- // system: system,
- plazaId: this.plazaId
- }
- if (system) {
- getParams.system = system
- }
- queryPic({ getParams }).then(res => {
- //console.log('机房布置图', res)
- this.tableImg = res.data ? res.data : []
- //判断有没有图片,有图片默认显示按钮是第一个tab,没有图片显示的是第二个tab
- if (this.tableImg.length > 0) {
- this.activeName = '1'
- } else if (this.systemName == '配电室机房') {
- this.activeName = '2'
- this.Index1()
- } else {
- this.activeName = '3'
- this.Index2()
- }
- })
- },
- // 明细表
- Index1() {
- let getParams = {
- location: this.location,
- plazaId: this.plazaId,
- page: this.page1,
- size: this.size1
- }
- if (this.floor2) {
- getParams.floor = this.floor2
- }
- if (this.ctbhInput) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.ctbhInput}:drawernum`
- } else {
- getParams.keyword = `${this.ctbhInput}:drawernum`
- }
- }
- if (this.cxggInput) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.cxggInput}:outspec`
- } else {
- getParams.keyword = `${this.cxggInput}:outspec`
- }
- }
- if (this.djbhInput) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.djbhInput}:wellnum`
- } else {
- getParams.keyword = `${this.djbhInput}:wellnum`
- }
- }
- if (this.kzhlInput) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.kzhlInput}:control`
- } else {
- getParams.keyword = `${this.kzhlInput}:control`
- }
- }
- queryDygjcxline({ getParams }).then(res => {
- if (res.result == 'success') {
- this.loading1 = false
- this.total1 = res.count
- this.table2 = res.data ? res.data : []
- //console.log('明细表', res)
- if (this.table2.length == 0) {
- }
- }
- })
- },
- // 核心设备
- Index2() {
- let postParams = {}
- let data = {
- location: this.location,
- plazaId: this.plazaId,
- page: this.page2,
- size: this.size2
- }
- if (this.sbjcInput) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.sbjcInput}:sbjc`
- } else {
- data.keyword = `${this.sbjcInput}:sbjc`
- }
- }
- if (this.ppxhInput) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.ppxhInput}:brand,sbxh`
- } else {
- data.keyword = `${this.ppxhInput}:brand,sbxh`
- }
- }
- if (this.sccsInput) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.sccsInput}:manufacturer`
- } else {
- data.keyword = `${this.sccsInput}:manufacturer`
- }
- }
- if (this.floorChange) {
- postParams.gname = this.floorChange
- }
- queryHxsb({ data, postParams }).then(res => {
- this.loading2 = false
- this.total2 = res.data.count
- this.table3 = res.data.data ? res.data.data : []
- })
- },
- Index1Emit(val) {
- this.page1 = val
- this.Index1()
- },
- Index2Emit(val) {
- this.page2 = val
- this.Index2()
- },
- Index3Emit(val) {
- this.page3 = val
- this.Index3()
- },
- Index4Emit(val) {
- this.page4 = val
- this.Index4()
- },
- // 机房维修记录
- Index3() {
- let getParams = {
- location: this.location,
- plazaId: this.plazaId,
- page: this.page3,
- size: this.size3,
- orderBy: 'sjjssj,0;location,1'
- }
- if (this.sfghSelect) {
- getParams.ismodel = this.sfghSelect
- }
- // 设备名称、编号
- if (this.sbmcInput4) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.sbmcInput4}:sbmc`
- } else {
- getParams.keyword = `${this.sbmcInput4}:sbmc,location`
- }
- }
- // 重要事项记录、描述
- if (this.zysxInput4) {
- if (getParams.keyword) {
- getParams.keyword = `${getParams.keyword + ';' + this.zysxInput4}:matters`
- } else {
- getParams.keyword = `${this.zysxInput4}:matters,manufacturer`
- }
- }
- // 填报时间
- if (this.tbsjDate) {
- getParams.reportedbyStartDate = this.tbsjDate[0] + '000000'
- getParams.reportedbyEndDate = this.tbsjDate[1] + '000000'
- }
- // 验收时间
- if (this.yssjDate) {
- getParams.sjjssjStartDate = this.yssjDate[0] + '000000'
- getParams.sjjssjEndDate = this.yssjDate[1] + '000000'
- }
- queryWxjf({ getParams }).then(res => {
- //console.log('维修', res)
- if (res.result == 'success') {
- this.loading3 = false
- this.total3 = res.count
- this.table4 = res.data ? res.data : []
- }
- })
- },
- // 机房维保记录
- Index4() {
- let postParams = {}
- let data = {
- location: this.location,
- plazaId: this.plazaId,
- page: this.page4,
- size: this.size4,
- orderBy: 'wb_gzglid,0;assetnum,1;reportedby,0;'
- }
- //
- // 任务开始日期
- if (this.rwksrq) {
- data.sjkssjStartDate = this.rwksrq[0] + '000000'
- data.sjkssjEndDate = this.rwksrq[1] + '000000'
- }
- // 任务完成日期
- if (this.rwwcrq) {
- data.sjwcsjStartDate = this.rwwcrq[0] + '000000'
- data.sjwcsjEndDate = this.rwwcrq[1] + '000000'
- }
- // 异常工单填报时间
- if (this.ycgdtbsj) {
- data.reportdateStartDate = this.ycgdtbsj[0] + '000000'
- data.reportdateEndDate = this.ycgdtbsj[1] + '000000'
- }
- // 异常工单验收时间
- if (this.ycgdyssj) {
- data.sjjssjStartDate = this.ycgdyssj[0] + '000000'
- data.sjjssjEndDate = this.ycgdyssj[1] + '000000'
- }
- //
- // 是否正常
- if (this.iszcSelect5) {
- data.zt = this.iszcSelect5
- }
- // 任务状态
- if (this.statuSelect5) {
- data.status = this.statuSelect5
- }
- if (this.sbmcInput5) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.sbmcInput5}:sbmc,assetnum`
- } else {
- data.keyword = `${this.sbmcInput5}:sbmc,assetnum`
- }
- }
- if (this.wbsxjlInput5) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.wbsxjlInput5}:matters`
- } else {
- data.keyword = `${this.wbsxjlInput5}:matters,description`
- }
- }
- if (this.rwbhInput5) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.rwbhInput5}:wb_gzglid`
- } else {
- data.keyword = `${this.rwbhInput5}:wb_gzglid`
- }
- }
- if (this.ycgdbhInput5) {
- if (data.keyword) {
- data.keyword = `${data.keyword + ';' + this.ycgdbhInput5}:wonum`
- } else {
- data.keyword = `${this.ycgdbhInput5}:wonum`
- }
- }
- queryWb({ data, postParams }).then(res => {
- //console.log('维保', res)
- this.loading4 = false
- this.total4 = res.data.count
- this.table5 = res.data.data ? res.data.data : []
- })
- },
- confirm() {
- this.Index3()
- },
- confirm2() {
- this.Index4()
- },
- // 下拉框数据
- changeSelect() {
- this.department = []
- let postParams = [
- {
- columnName: { status: 'status', zt: 'zt' },
- tableName: 'v_glsms_wbzy'
- }
- ]
- let data = {
- plazaId: this.plazaId
- }
- querySelect({ data, postParams }).then(res => {
- //console.log('下拉框', res)
- let status = [],
- zt = []
- status = res.data.data.v_glsms_wbzy.status ? res.data.data.v_glsms_wbzy.status : []
- zt = res.data.data.v_glsms_wbzy.zt ? res.data.data.v_glsms_wbzy.zt : []
- if (status.length > 0) {
- status.forEach(el => {
- let obj = {
- id: el.key,
- name: el.value
- }
- this.status.push(obj)
- })
- }
- if (zt.length > 0) {
- zt.forEach(el => {
- let obj = {
- id: el.key,
- name: el.value == '正常' ? '是' : '否'
- }
- this.zt.push(obj)
- })
- }
- })
- },
- // 查询楼层功能下的机房属于哪类设备
- init() {
- this.smsxtArr = []
- let params = {
- getParams: {
- locationid: this.location,
- plazaId: this.plazaId
- }
- }
- querySystem(params).then(res => {
- this.smsxtArr = res.data ? res.data[0] : {}
- this.Index(this.smsxtArr.smsxt)
- this.content = `查看${this.$cookie.get('floorNow')}层${this.smsxtArr.smsxtname}分布图`
- })
- },
- // 打开机房弹框
- open(name) {
- this.visible = true
- this.systemName = name.name
- this.location = name.location
- if (name.type == 'floor') {
- this.init()
- } else if (name.type == 'system') {
- let floor = this.$cookie.get('floorNow')
- this.content = `查看${floor}层楼层功能图`
- this.Index(null)
- }
- },
- // 机房右上角的跳转 如果是在楼层功能打开的机房则要跳转到设备设施对应的系统\楼层 反之亦然
- jumpFloor() {
- // if (this.smsxtArr.smsxt) {
- if (location.pathname.split('/')[3] == 'equipment') {
- this.$router.push({ path: '/home/floorFunc' })
- } else {
- this.$router.push({ path: '/home/equipment', query: { smsxt: this.smsxtArr.smsxt } })
- }
- // }
- }
- },
- mounted() {}
- }
- </script>
- <style lang="less" scoped>
- .compute-box {
- .compute-zf {
- width: 15px;
- height: 13px;
- background: url('../../assets/imgs/zffx.png');
- background-repeat: no-repeat;
- background-size: 100% 100%;
- position: absolute;
- right: 74px;
- top: 25px;
- cursor: pointer;
- &::after {
- content: '';
- position: absolute;
- right: -16px;
- width: 1px;
- height: 16px;
- background: rgba(216, 216, 216, 1);
- }
- }
- .picker-box {
- display: flex;
- align-items: center;
- background: #fff;
- padding: 0 6px;
- border: 1px solid #dcdfe6;
- border-radius: 4px;
- height: 32px;
- box-sizing: border-box;
- margin-right: 12px;
- .picker-span {
- margin-right: 6px;
- color: rgba(0, 0, 0, 0.65);
- }
- }
- .compute-span {
- width: 100%;
- height: 1px;
- background: rgba(0, 0, 0, 0.06);
- margin-bottom: 20px;
- }
- .compute-center {
- display: flex;
- align-items: center;
- margin-bottom: 12px;
- }
- //
- .dialog-none {
- width: 100px;
- position: absolute;
- right: 0;
- .input-dialog {
- .input-dialog-top {
- color: #c3c7cb;
- cursor: pointer;
- position: absolute;
- top: -45px;
- right: 0px;
- }
- .input-dialog-form {
- padding: 20px 24px;
- background: rgba(255, 255, 255, 1);
- border-radius: 4px;
- border: 1px solid rgba(195, 199, 203, 1);
- z-index: 99999;
- position: absolute;
- top: -20px;
- right: 0px;
- }
- .input-dialog-p {
- margin-bottom: 8px;
- font-size: 14px;
- font-family: MicrosoftYaHei;
- color: rgba(100, 108, 115, 1);
- line-height: 22px;
- }
- .input-dialog-p2 {
- margin-bottom: 16px;
- }
- }
- .input-dialog-foot {
- // margin-bottom: 16px;
- display: flex;
- justify-content: flex-end;
- }
- }
- .compute-tab {
- margin-top: 16px;
- padding: 0 24px;
- }
- }
- </style>
- <style lang="less">
- .compute-box {
- .el-dialog {
- padding: 16px 20px 20px;
- overflow: hidden;
- .el-dialog__header {
- padding: 0;
- font-size: 16px;
- font-family: PingFangSC-Medium, PingFang SC;
- font-weight: 500;
- color: rgba(0, 0, 0, 0.85);
- line-height: 24px;
- padding-bottom: 16px;
- }
- }
- .compute-tab {
- .el-dialog__title {
- font-size: 16px;
- font-family: PingFangSC-Medium, PingFang SC;
- font-weight: 500;
- color: rgba(0, 0, 0, 0.85);
- line-height: 24px;
- }
- .el-dialog__body {
- padding: 0 24px;
- }
- .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
- .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
- .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
- .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
- padding-left: 16px;
- }
- .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
- .el-tabs--bottom .el-tabs__item.is-top:last-child,
- .el-tabs--top .el-tabs__item.is-bottom:last-child,
- .el-tabs--top .el-tabs__item.is-top:last-child {
- padding-right: 16px;
- }
- .el-tabs__nav-wrap::after {
- height: 0;
- }
- .el-tabs__item {
- padding: 5px 16px;
- height: 30px;
- line-height: 22px;
- font-size: 14px;
- font-family: MicrosoftYaHei;
- color: rgba(31, 36, 41, 1);
- border: 1px solid rgba(195, 199, 203, 1);
- }
- /deep/ .el-tabs__item:last-child {
- border-radius: 0px 4px 4px 0px;
- }
- /deep/ .el-tabs__item:nth-child(2) {
- border-radius: 4px 0px 0px 4px;
- }
- .el-tabs,
- .el-tabs__content {
- height: 800px;
- }
- .el-tabs__active-bar {
- background-color: transparent !important;
- }
- .is-active {
- color: #025baa;
- border-color: #025baa;
- }
- .compute-table {
- .el-table td,
- .el-table th {
- padding: 8px 0;
- }
- }
- }
- .el-input--suffix .el-input__inner {
- padding-right: 20px;
- }
- .el-dialog__wrapper {
- transition-duration: 0.3s;
- }
- .dialog-fade-enter-active {
- animation: none !important;
- }
- .dialog-fade-leave-active {
- transition-duration: 0.15s !important;
- animation: none !important;
- }
- .dialog-fade-enter-active .el-dialog,
- .dialog-fade-leave-active .el-dialog {
- animation-fill-mode: forwards;
- }
- .dialog-fade-enter-active .el-dialog {
- animation-duration: 0.3s;
- animation-name: anim-open;
- animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);
- }
- .dialog-fade-leave-active .el-dialog {
- animation-duration: 0.3s;
- animation-name: anim-close;
- }
- @keyframes anim-open {
- 0% {
- opacity: 0;
- transform: scale3d(0, 0, 1);
- }
- 100% {
- opacity: 1;
- transform: scale3d(1, 1, 1);
- }
- }
- @keyframes anim-close {
- 0% {
- opacity: 1;
- }
- 100% {
- opacity: 0;
- transform: scale3d(0.5, 0.5, 1);
- }
- }
- .picker-box {
- .el-input__inner {
- border: none;
- }
- .el-range-editor.el-input__inner {
- padding: 3px 0px;
- }
- .el-icon-date {
- display: none;
- }
- .el-range__close-icon {
- position: absolute;
- right: 0px;
- top: 2px;
- }
- .el-range-editor--mini .el-range-input {
- font-size: 14px;
- color: rgb(31, 36, 41);
- }
- }
- }
- </style>
|