Commit 579181c9 authored by co_dengxiongwen's avatar co_dengxiongwen

页面调整

parent 374a322b
...@@ -9,29 +9,24 @@ ...@@ -9,29 +9,24 @@
el-button( el-button(
size="mini", size="mini",
type="primary", type="primary",
@click="handleDate(index)", @click="handleDate(item.id)",
v-for="(item, index) in typeList", v-for="(item, index) in typeList",
:key="index", :key="index",
:class="[index == currentActive ? 'isActive' : '']" :class="[item.id == currentActive ? 'isActive' : '']"
) {{ item.name }} ) {{ item.name }}
span(v-if="type==1") span(v-if="type==1")
el-table( :data='dataList' size="mini" ,style='width: 100%;' :header-cell-style="{ background: '#EEF8FF', color: '#333333' }") el-table( :data='dataList' size="mini" ,style='width: 100%;' :header-cell-style="{ background: '#EEF8FF', color: '#333333' }")
el-table-column( :resizable="false" type='index', header-align='center', align='center', label='序号') el-table-column( :resizable="false" type='index', header-align='center', align='center', label='序号')
el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='温度(℃)') el-table-column( :resizable="false" prop='temperature', header-align='center', align='center', label='温度(℃)')
el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='湿度(%RH)') el-table-column( :resizable="false" prop='humidity', header-align='center', align='center', label='湿度(%RH)')
el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='CO2(PPM)') el-table-column( :resizable="false" prop='carbon_dioxide', header-align='center', align='center', label='CO2(PPM)')
el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='设备状态') //- el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='设备状态')
el-table-column( :resizable="false" prop='name', header-align='center', align='center', label='采集时间') el-table-column( :resizable="false" prop='create_time', header-align='center', align='center', label='采集时间')
tablePagination(:pageSize="pageSize" :totalSize="totalPage" @parentMethod='getDataList') tablePagination(:pageSize="pageSize" :totalSize="totalPage" @parentMethod='getDataList')
span(v-else) span(v-else)
.echartsWarp(width="100%", flex) .echartsWarp(width="100%", flex)
div(v-for='item in chartList' :key='item.id') div(v-for='item in chartList' :key='item.id')
chart(:id="item.id", :data="data", :title="item.title", :color="item.color") chart(:id="item.id", :data="item.data", :title="item.title", :color="item.color")
//- div
//- pie
span.dialog-footer(slot='footer')
el-button(@click='visible = false' size='mini') 取消
el-button(type='primary', @click='dataFormSubmit' size='mini') 确定
</template> </template>
<script> <script>
...@@ -48,12 +43,12 @@ export default { ...@@ -48,12 +43,12 @@ export default {
data() { data() {
return { return {
typeList: [ typeList: [
{ name: '当日' }, { name: '当日', id: 1 },
{ name: '本周' }, { name: '本周', id: 2 },
{ name: '当月' }, { name: '当月', id: 3 },
{ name: '今年' } { name: '今年', id: 4 }
], ],
currentActive: '0', currentActive: 1,
type: null, type: null,
pageSize: 10, pageSize: 10,
totalPage: 0, totalPage: 0,
...@@ -64,75 +59,80 @@ export default { ...@@ -64,75 +59,80 @@ export default {
}, },
dataList: [], dataList: [],
chartList: [ chartList: [
{ id: '11', title: '温度', color: '#21ACFC' }, { id: '11', title: '温度', color: '#21ACFC', data: [] },
{ id: '22', title: '湿度', color: '#36CBCB' }, { id: '22', title: '湿度', color: '#36CBCB', data: [] },
{ id: '33', title: 'CO2', color: '#4ECB74' }, { id: '33', title: 'CO2', color: '#4ECB74', data: [] },
{ id: '77', title: '故障报警', color: '#975FE4' } { id: '44', title: '故障报警', color: '#975FE4', data: [] }
],
data: [
['2019-8-14 8:00:00', 70],
['2019-8-14 8:00:01', 60],
['2019-8-14 8:00:02', 30],
['2019-8-14 8:00:03', 79],
['2019-8-14 8:00:06', 10],
['2019-8-14 8:00:20', 31]
], ],
dataRule: {} dataRule: {}
} }
}, },
methods: { methods: {
init(id, type) { init(data, type) {
this.type = type this.type = type
this.dataForm.id = id
this.visible = true this.visible = true
if (id) { this.currentActive = 1
// this.$http({ if (this.type === 1) {
// url: this.$http.adornUrlProduct(`/brandMain/getId/${this.dataForm.id}`), this.getDataList() //获取历史数据列表
// method: 'get', } else if (this.type === 2) {
// params: this.$http.adornParams() this.getDataListTb()
// }).then((data) => { }
// if (data && data.code === 0) { },
// this.dataForm = data.bean getDataList(page, size) {
// } this.$http({
// }) url: this.$http.adornUrl(`/kanban/getListByTypeAndId`),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
resourceType: '507ba9ae22174e4dbbf32dbf34dd7139', //室内气象站
type: this.currentActive,
page: page || this.pageIndex,
rows: size || this.pageSize
})
}).then((data) => {
if (data && data.code === 0) {
console.log('室内气象站历史数据', data)
this.dataList = data.page.records
this.totalPage = data.page.total
} else { } else {
this.$nextTick(() => { this.dataList = []
this.$refs['dataForm'].resetFields() this.totalPage = 0
}
})
},
getDataListTb() {
this.$http({
url: this.$http.adornUrl('/analysis/getSnqxzInfoTj'),
method: 'get',
params: this.$http.adornParams({
resourceId: '',
type: this.currentActive
}) })
}).then((data) => {
if (data && data.code === 0) {
// console.log('数据', data)
this.chartList[0].data = data.temperatureList
this.chartList[1].data = data.humidityList
this.chartList[2].data = data.carbonDioxideList
this.chartList[3].data = data.carbonDioxideList
} }
})
}, },
getDataList() {},
// 当日 ,本周 // 当日 ,本周
handleDate(i) { handleDate(i) {
this.currentActive = i this.currentActive = i
}, if (this.type === 1) {
// 表单提交 this.getDataList() //获取历史数据列表
dataFormSubmit() { } else if (this.type === 2) {
this.$refs['dataForm'].validate((valid) => { this.getDataListTb()
if (valid) {
// this.$http({
// url: this.$http.adornUrlProduct(`/brandMain/${!this.dataForm.id ? 'save' : 'update'}`),
// method: 'post',
// data: this.dataForm
// }).then((data) => {
// if (data && data.code === 0) {
// this.$message({
// message: '操作成功',
// type: 'success',
// duration: 1500,
// onClose: () => {
// this.visible = false
// this.$emit('refreshdatalist')
// }
// })
// } else {
// this.$message.error(data.msg)
// }
// })
} }
},
showParams(data, type) {
console.log(111)
this.historyVisible = true
this.$nextTick(() => {
this.$refs.history.init(data, type)
}) })
} }
} }
......
...@@ -97,7 +97,7 @@ card-warp(title="室内气象数据", height="45px", showBackground) ...@@ -97,7 +97,7 @@ card-warp(title="室内气象数据", height="45px", showBackground)
header-align="center", header-align="center",
align="center", align="center",
width="180", width="180",
label="操作内容" label="操作"
) )
template(slot-scope="scope") template(slot-scope="scope")
el-button( el-button(
......
...@@ -218,7 +218,7 @@ export default { ...@@ -218,7 +218,7 @@ export default {
}, },
getDataListTb() { getDataListTb() {
this.$http({ this.$http({
url: this.$http.adornUrl('/kanban/getSwqxzInfoTj'), url: this.$http.adornUrl('/analysis/getSwqxzInfoTj'),
method: 'get', method: 'get',
params: this.$http.adornParams({ params: this.$http.adornParams({
type: this.currentActive type: this.currentActive
......
...@@ -197,23 +197,37 @@ export default { ...@@ -197,23 +197,37 @@ export default {
{ id: '77', title: '辐射', color: '#975FE4', data: [] }, { id: '77', title: '辐射', color: '#975FE4', data: [] },
{ id: '88', title: '故障报警数', color: '#F2637B', data: [] } { id: '88', title: '故障报警数', color: '#F2637B', data: [] }
], ],
type: 1, type: 1
data: [
// ['2019-8-14 8:00:00', 70],
// ['2019-8-14 8:00:01', 60],
// ['2019-8-14 8:00:02', 30],
// ['2019-8-14 8:00:03', 79],
// ['2019-8-14 8:00:06', 10],
// ['2019-8-14 8:00:20', 31]
]
} }
}, },
mounted() { mounted() {
this.getDataList() this.getDataListTb()
}, },
methods: { methods: {
// 获取数据 // 获取数据列表
getDataList() { getDataList(page, size) {
this.$http({
url: this.$http.adornUrl('/liResource/list'),
method: 'post',
data: {
type: '9a570e608d0840499551eca89d76449d', //室外气象站
page: page || this.pageIndex,
size: size || this.pageSize
}
}).then((data) => {
if (data && data.code === 0) {
console.log('数据', data)
// this.dataList = data.page.rows
// this.tableColums = crecords
this.totalSize = data.page.total
} else {
this.dataList = []
this.totalSize = 0
}
})
},
getDataListTb() {
this.$http({ this.$http({
url: this.$http.adornUrl('/kanban/getSwqxzInfoTj'), url: this.$http.adornUrl('/kanban/getSwqxzInfoTj'),
method: 'get', method: 'get',
......
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