| | |
| | | value: 380, |
| | | color: '#00DFFC', |
| | | }, |
| | | { |
| | | name: '告警占比', |
| | | value: 180, |
| | | color: '#FF8B34', |
| | | }, |
| | | // { |
| | | // name: '告警占比', |
| | | // value: 180, |
| | | // color: '#FF8B34', |
| | | // }, |
| | | { |
| | | name: '告警总数', |
| | | value: 180, |
| | |
| | | value: 280, |
| | | color: '#2EEA9D', |
| | | }, |
| | | { |
| | | name: '告警机房占比', |
| | | value: 70, |
| | | color: '#F3E501', |
| | | } |
| | | // { |
| | | // name: '告警机房占比', |
| | | // value: 70, |
| | | // color: '#F3E501', |
| | | // } |
| | | ] |
| | | } |
| | | } |
| | |
| | | color: '#00DFFC', |
| | | }, |
| | | { |
| | | name: '告警占比', |
| | | value: 10, |
| | | color: '#FF8B34', |
| | | }, |
| | | { |
| | | name: '告警总数', |
| | | value: 10, |
| | | color: '#ED4882', |
| | |
| | | value: 10, |
| | | color: '#2EEA9D', |
| | | }, |
| | | { |
| | | name: '告警机房占比', |
| | | value: 10, |
| | | color: '#F3E501', |
| | | } |
| | | ] |
| | | } |
| | | let resData = res.data.data; |
| | |
| | | </div> --> |
| | | </div> |
| | | <div class="template-item" v-for="(item,i) in listData" :key="i"> |
| | | <div class="template-image" |
| | | :style="{backgroundImage:item.screenshot?'url(' + item.screenshot + '}':'url(' + require('../assets/images/notbg.png') + ')',backgroundSize:'cover'}"> |
| | | <div class="template-image" :style="{backgroundImage:item.screenshot?'url(' + item.screenshot + '}':'url(' + require('../assets/images/notbg.png') + ')',backgroundSize:'cover'}"> |
| | | <div class="screen-edit"> |
| | | <el-tooltip class="item" effect="dark" content="删除" placement="top"> |
| | | <i class="preview el-icon-delete" @click="skip(3,item)"></i> |
| | |
| | | </div> |
| | | <div class="activationText">{{item.activeStatus==1?'已激活':'未激活'}}</div> |
| | | </div> |
| | | <input type="text" class="template-info input-text" :ref="item.ref" v-model="item.name" |
| | | @focus="alterName(item)" @blur="overEvent(item)"> |
| | | <input type="text" class="template-info input-text" :ref="item.ref" v-model="item.name" @focus="alterName(item)" @blur="overEvent(item)"> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | url: "/application", |
| | | data: { |
| | | id: item.id, |
| | | name: item.name |
| | | name: item.name, |
| | | userId: self.opt.userId |
| | | } |
| | | }).then(res => { |
| | | if (res.data.code == 1) { |
| | |
| | | flex-direction: column; |
| | | background: #031d67; |
| | | height: 360px; |
| | | transition: .5s height cubic-bezier(.65, .05, .36, 1); |
| | | transition: 0.5s height cubic-bezier(0.65, 0.05, 0.36, 1); |
| | | width: 100%; |
| | | } |
| | | |
| | |
| | | position: absolute; |
| | | width: 100%; |
| | | height: 360px; |
| | | background-image: url('../assets/images/banner.png'); |
| | | background-image: url("../assets/images/banner.png"); |
| | | background-size: cover; |
| | | background-position: center; |
| | | transition: .5s opacity cubic-bezier(.4, 0, 1, 1); |
| | | transition: 0.5s opacity cubic-bezier(0.4, 0, 1, 1); |
| | | z-index: 1; |
| | | } |
| | | |
| | |
| | | box-shadow: 0 0 10px -6px #000; |
| | | border: 1px solid #007ed3; |
| | | margin: 16px; |
| | | transition: .2s; |
| | | transition: 0.2s; |
| | | outline: 1px solid transparent; |
| | | cursor: default; |
| | | position: relative; |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | transition: .2s; |
| | | transition: 0.2s; |
| | | position: relative; |
| | | background: #021651; |
| | | } |
| | |
| | | background-color: #43f9fd; |
| | | color: #011751; |
| | | border-color: #43f9fd; |
| | | |
| | | } |
| | | |
| | | .template-list .template-item.--blank .template-image { |
| | | box-shadow: inset 0 0 46px 0 rgba(136, 215, 255, .29); |
| | | box-shadow: inset 0 0 46px 0 rgba(136, 215, 255, 0.29); |
| | | } |
| | | |
| | | .template-list .template-info { |
| | |
| | | padding: 10px; |
| | | height: 44px; |
| | | background: #007ed3; |
| | | transition: .2s; |
| | | transition: 0.2s; |
| | | } |
| | | |
| | | .template-item.--blank .template-info { |
| | |
| | | pointer-events: none; |
| | | align-items: center; |
| | | justify-content: center; |
| | | transition: opacity .2s; |
| | | background: rgba(0, 0, 0, .81); |
| | | transition: opacity 0.2s; |
| | | background: rgba(0, 0, 0, 0.81); |
| | | } |
| | | |
| | | .template-item .screen-edit .preview { |
| | |
| | | right: 15px; |
| | | color: #fff; |
| | | cursor: pointer; |
| | | transition: color .2s; |
| | | transition: color 0.2s; |
| | | padding: 5px; |
| | | font-size: 24px; |
| | | background: #007ed3; |