Commit 11c2677f authored by xiexingan's avatar xiexingan

调整

parent 93f138a8
......@@ -26,11 +26,11 @@ export default {
type: 'pie',
radius: '50%',
data: [
{ value: 1048, name: '搜索引擎' },
{ value: 735, name: '直接访问' },
{ value: 580, name: '邮件营销' },
{ value: 484, name: '联盟广告' },
{ value: 300, name: '视频广告' }
{ value: 1048, name: '搜索引擎', itemStyle: { color: 'skyblue' } },
{ value: 735, name: '直接访问', itemStyle: { color: '#F2637B' } },
{ value: 580, name: '邮件营销', itemStyle: { color: '#8EE0E0' } },
{ value: 484, name: '联盟广告', itemStyle: { color: '#4ECB74' } },
{ value: 300, name: '视频广告', itemStyle: { color: '#FFCC00' } }
]
}
......
......@@ -4,112 +4,119 @@
<script>
export default {
data() {
return {
legendData: [],
nameList: [
'赵',
'钱',
'孙',
'范',
'屈',
'项',
'祝',
'董',
'梁',
'杜',
'阮',
'蓝',
'闵',
'席',
'季',
'麻',
'强',
'贾',
'路',
'娄',
'危'
],
list: {}
}
},
created() {
this.list = this.genData(30)
},
mounted() {
this.ring()
console.log(this.list)
},
methods: {
ring() {
let dom = document.getElementById('pie4')
if (!dom) return
let myCharts = this.$echarts.init(dom)
let option = {
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
type: 'scroll',
orient: 'vertical',
right: 10,
top: 20,
bottom: 20,
data: this.list.legendData,
selected: this.list.selected
},
series: [
{
name: '姓名',
type: 'pie',
radius: '55%',
center: ['40%', '50%'],
data: this.list.seriesData,
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
}
myCharts.setOption(option)
data() {
return {
legendData: [],
nameList: [
'赵',
'钱',
'孙',
'范',
'屈',
'项',
'祝',
'董',
'梁',
'杜',
'阮',
'蓝',
'闵',
'席',
'季',
'麻',
'强',
'贾',
'路',
'娄',
'危'
],
list: {}
}
},
created() {
// this.list = this.genData(30)
},
mounted() {
this.ring()
console.log(this.list)
},
methods: {
ring() {
let dom = document.getElementById('pie4')
if (!dom) return
let myCharts = this.$echarts.init(dom)
let option = {
tooltip: {
trigger: 'item'
// formatter: '{a} <br/>{b} : {c} ({d}%)'
},
genData(count) {
var legendData = []
var seriesData = []
for (var i = 0; i < count; i++) {
var name =
Math.random() > 0.65
? this.makeWord(4, 1) + '·' + this.makeWord(3, 0)
: this.makeWord(2, 1)
legendData.push(name)
seriesData.push({
name: name,
value: Math.round(Math.random() * 100000)
})
}
legend: {
type: 'scroll',
orient: 'vertical',
right: 10,
top: 20,
bottom: 20,
data: [1, 2, 3, 4, 5, 6],
return {
legendData: legendData,
seriesData: seriesData
}
selected: [1, 2, 3, 4, 5, 6]
},
makeWord(max, min) {
var nameLen = Math.ceil(Math.random() * max + min)
var name = []
for (var i = 0; i < nameLen; i++) {
name.push(
this.nameList[ Math.round(Math.random() * this.nameList.length - 1) ]
)
series: [
{
name: '姓名',
type: 'pie',
radius: '55%',
center: ['40%', '50%'],
data: [
{ name: 1, value: '123' },
{ name: 1, value: '123' },
{ name: 1, value: '123' },
{ name: 1, value: '123' },
{ name: 1, value: '123' },
{ name: 1, value: '123' }
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
return name.join('')
}
}
]
}
myCharts.setOption(option)
},
genData(count) {
var legendData = []
var seriesData = []
for (var i = 0; i < count; i++) {
var name =
Math.random() > 0.65
? this.makeWord(4, 1) + '·' + this.makeWord(3, 0)
: this.makeWord(2, 1)
legendData.push(name)
seriesData.push({
name: name,
value: Math.round(Math.random() * 100000)
})
}
return {
legendData: legendData,
seriesData: seriesData
}
},
makeWord(max, min) {
var nameLen = Math.ceil(Math.random() * max + min)
var name = []
for (var i = 0; i < nameLen; i++) {
name.push(
this.nameList[Math.round(Math.random() * this.nameList.length - 1)]
)
}
return name.join('')
}
}
}
</script>
......
export const tableColumsOne = [
{
align: 'center',
prop: 'A',
label: '设备名称',
width: 132
},
{
align: 'center',
prop: 'B',
label: '设备位置'
// width: 112,
},
{
align: 'center',
prop: 'C',
label: '控制方式',
width: 132
},
{
align: 'center',
prop: 'D',
label: '能耗统计',
width: 182
},
{
align: 'center',
prop: 'E',
label: '设备编号',
width: 132
}
]
export const tableDataOne = [
{
A: '多联空调A1',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A2',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A3',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A4',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A5',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: ' 多联空调A4',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: ' 多联空调A4',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: ' 多联空调A4',
B: '右侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: ' 多联空调A4',
B: '右侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A10',
B: '右侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: '多联空调A',
B: '左侧办公房屋',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
}
]
export const tableDataTwo = [
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: ' 多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLW-A1'
},
{
A: ' 多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: ' 多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: ' 多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
},
{
A: '多联新风',
B: '屋面',
C: '开/关/设定温度',
D: '今日用电量/本月用电量',
E: 'DLX-1'
}
]
export const tableDataThree = [
{
A: '机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 机房空调',
B: '通信机械室',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 机房空调',
B: '右侧办公房屋',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '信息机房',
B: '右侧办公房屋',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '信息机房',
B: '左侧办公房屋',
C: '显示状态',
D: '今日用电量/本月用电量',
E: 'JK-1'
}
]
export const tableDataFour = [
{
A: '排风机',
B: '售票厅',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'PF-B5'
},
{
A: '排风机',
B: '消防泵房',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'PF-B4'
},
{
A: '排风机',
B: '车站备品间',
C: '开/关',
D: '今日用电量/本月用电量',
E: '厕所排风机1#'
},
{
A: '排风机',
B: '候车厅公共卫生间',
C: '开/关',
D: '今日用电量/本月用电量',
E: '厕所排风机2#'
},
{
A: '排风机',
B: '出站通道公共卫生间',
C: '开/关',
D: '今日用电量/本月用电量',
E: '厕所排风机3#'
},
{
A: ' 换气扇',
B: '吸氧间',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 换气扇',
B: '吸氧间',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 换气扇',
B: '吸氧间',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: ' 换气扇',
B: '吸氧间',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '换气扇',
B: '站长室',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
},
{
A: '换气扇',
B: 'VIP候车室',
C: '开/关',
D: '今日用电量/本月用电量',
E: 'JK-1'
}
]
......@@ -3,7 +3,7 @@
<cardList cardListTitle="候车大厅控制">
<div slot="content" >
<div>
<el-form :inline="true" :model="formData" label-width="100">
<el-row>
<el-col :span="12">
......@@ -42,7 +42,7 @@
<!-- <el-button type="primary" >查询</el-button> -->
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :md="12" :lg="4">
......@@ -70,7 +70,7 @@
</el-col>
</el-row>
</el-form>
</div>
<!-- tabs -->
<div style="margin-bottom: 20px">
......@@ -90,7 +90,7 @@
<enTable v-on:handleBtnClick="handleBtnClick" :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true">
<template v-slot:operation='scope'>
<el-button type="text" @click="hallModalVisible=true">编辑</el-button>
</template>
</enTable>
</div>
......@@ -100,201 +100,79 @@
</div>
</template>
<script>
import cardList from "../../components/cardList";
import enTable from "../../components/enTable";
import cardList from '../../components/cardList'
import enTable from '../../components/enTable'
import enTabs from '../../components/enTabs'
import hallModal from './components/hallModal'
const tableColums = [
{
align: "center",
prop: "A",
label: "设备名称",
width: 112,
},
{
align: "center",
prop: "B",
label: "设备描述",
// width: 112,
},
{
align: "center",
prop: "C",
label: "运行状态",
width: 132,
},
{
align: "center",
prop: "D",
label: "当前频率",
width: 132,
},
{
align: "center",
prop: "E",
label: "故障报警",
width: 132,
},
{
align: "center",
prop: "F",
label: "说明",
width: 132,
},
{
align: "center",
prop: "G",
label: "设备编号",
width: 132,
},
];
const tableData = [
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
{
A: "A",
B: "YA01254N51",
C: "正常",
D: "110Hz",
E: "",
F: "说明",
G: "QY0001",
},
];
import { tableDataOne, tableColumsOne, tableDataTwo, tableDataThree, tableDataFour } from './config'
export default {
components: {
cardList,
enTable,
enTabs,
hallModal,
hallModal
},
watch: {
activeTab(val) {
switch (val) {
case '01':
this.tableColums = tableColumsOne
this.tableData = tableDataOne
break
case '02':
this.tableColums = tableColumsOne
this.tableData = tableDataTwo
break
case '03':
this.tableColums = tableColumsOne
this.tableData = tableDataThree
break
case '04':
this.tableColums = tableColumsOne
this.tableData = tableDataFour
break
}
}
},
data() {
return {
tableColums,
tableData,
activeTab:'01',
activeTab: '01',
tableData: tableDataOne,
tableColums: tableColumsOne,
formData: {},
tabList: [
{
value: "01",
label: "热泵",
value: '01',
label: '热泵'
},
{
value: "02",
label: "风冷热泵机组",
value: '02',
label: '风冷热泵机组'
},
{
value: "03",
label: "室内机风柜",
value: '03',
label: '室内机风柜'
},
{
value: "04",
label: " 水泵",
},
value: '04',
label: ' 水泵'
}
],
hallModalVisible:false,
};
hallModalVisible: false
}
},
methods: {
cancelhandle(){
this.$nextTick(()=>{
cancelhandle() {
this.$nextTick(() => {
this.hallModalVisible = false
})
},
handleBtnClick(){
handleBtnClick() {
this.hallModalVisible = true
}
},
};
}
}
</script>
<style lang="scss" >
.hall {
......@@ -318,4 +196,3 @@ export default {
}
</style>
......@@ -12,7 +12,7 @@
></el-tab-pane>
</el-tabs>
<div style="margin-top: 20px"></div>
<en-table :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true">
<en-table :tableData="tableData" :tableColums="tableColums" :isShowOp="true" isShowPage="true">
<template v-slot:operation='scope'>
<el-button type="text">编辑</el-button>
</template>
......@@ -167,65 +167,65 @@
// G: "QY0001",
// },
// ];
import cardList from "../../components/cardList";
import enTabs from "../../components/enTabs";
import enTable from "../../components/enTable";
import { tableDataOne,tableColumsOne ,tableDataTwo,tableDataThree,tableDataFour} from './config'
import cardList from '../../components/cardList'
import enTabs from '../../components/enTabs'
import enTable from '../../components/enTable'
import { tableDataOne, tableColumsOne, tableDataTwo, tableDataThree, tableDataFour } from './config'
export default {
name: "officeAreaControl",
name: 'officeAreaControl',
components: {
cardList,
enTabs,
enTable,
enTable
},
data() {
return {
activeTab:'01',
tableData:tableDataOne,
tableColums:tableColumsOne,
activeTab: '01',
tableData: tableDataOne,
tableColums: tableColumsOne,
officeTabList: [
{
value: "01",
label: "多联空调",
value: '01',
label: '多联空调'
},
{
value: "02",
label: "多联新风",
value: '02',
label: '多联新风'
},
{
value: "03",
label: "机房空调",
value: '03',
label: '机房空调'
},
{
value: "04",
label: "排风机",
},
],
};
value: '04',
label: '排风机'
}
]
}
},
watch:{
activeTab(val){
switch (val){
watch: {
activeTab(val) {
switch (val) {
case '01':
this.tableColums = tableColumsOne
this.tableData = tableDataOne
break;
break
case '02':
this.tableColums = tableColumsOne
this.tableData = tableDataTwo
break;
break
case '03':
this.tableColums = tableColumsOne
this.tableData = tableDataThree
break;
break
case '04':
this.tableColums = tableColumsOne
this.tableData = tableDataFour
break;
break
}
}
}
};
}
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment