tangxuan
/
yy_rms_39zhiyao_duizhao
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(src/views/reagent/mainoverview/): 完成主预览

Browse Source
duizhaopin_ui
duan 2 years ago
parent 5897db910b
commit c63a5c7e80
4 changed files with 100 additions and 49 deletions
Show Stats Download Patch File Download Diff File

10
src/api/common.js
Unescape View File

@ -0,0 +1,10 @@
import request from '@/utils/request'
// /api/client/client_list
export function client_list(data) {
return request({
url: '/api/client/client_list',
method: 'post',
data
})
}

9
src/api/reagent/overView.js
Unescape View File

@ -25,3 +25,12 @@ export function home_drug_remaining(data) {
data
})
}
// /api/home/get_monitoring_info
export function get_monitoring_info(data) {
return request({
url: '/api/home/get_monitoring_info',
method: 'post',
data
})
}

4
src/permission.js
Unescape View File

@ -31,12 +31,12 @@ router.beforeEach(async(to, from, next) => {
} else {
try {
// get user info
await store.dispatch('user/getInfo')
// await store.dispatch('user/getInfo')
next()
} catch (error) {
// remove token and go to login page to re-login
await store.dispatch('user/resetToken')
// await store.dispatch('user/resetToken')
Message.error(error || 'Has Error')
next(`/login?redirect=${to.path}`)
NProgress.done()

120
src/views/reagent/mainoverview/index.vue
Unescape View File

@ -14,26 +14,26 @@
<div class="header">
<div class="title">环境监控图</div>
<div>
<el-select v-model="value" size="small" placeholder="请选择">
<el-select v-model="client_id" size="small" placeholder="请选择柜体" @change="(val) => valueChange('id',val)">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in clientOptions"
:key="item.id"
:label="item.client_name"
:value="item.client_id"
/>
</el-select>
<el-select v-model="value" size="small" placeholder="请选择">
<el-select v-model="client_date" size="small" placeholder="请选择" @change="(val) => valueChange('date',val)">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="(item,index) in options"
:key="index"
:label="item"
:value="index+1"
/>
</el-select>
<el-radio-group v-model="radio1" size="small">
<el-radio-button label="速度" />
<el-radio-button label="温度" />
<el-radio-button label="VOC含量" />
<el-radio-group v-model="radio1" size="small" @change="(val) => valueChange('radio',val)">
<el-radio-button :label="1">温度</el-radio-button>
<el-radio-button :label="2">湿度</el-radio-button>
<el-radio-button :label="3">VOC含量</el-radio-button>
</el-radio-group>
</div>
</div>
@ -54,24 +54,24 @@
</el-popover>
</div>
<div>
<el-button size="small">查看全部</el-button>
<!-- <el-button size="small">查看全部</el-button>-->
</div>
</div>
<div class="header">
<el-select v-model="value" size="small" style="margin-right: 0" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-select v-model="value" :disabled="rloading" size="small" style="margin-right: 0" placeholder="请选择">
<!-- <el-select v-model="client_id" size="small" style="margin-right: 0" placeholder="请选择">-->
<!-- <el-option-->
<!-- v-for="item in options"-->
<!-- :key="item.value"-->
<!-- :label="item.label"-->
<!-- :value="item.value"-->
<!-- />-->
<!-- </el-select>-->
<el-select v-model="rclient_id" :disabled="rloading" size="small" style="margin-right: 0" placeholder="请选择柜体" @change="remainingPageChange(1)">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in clientOptions"
:key="item.client_id"
:label="item.client_name"
:value="item.client_id"
/>
</el-select>
</div>
@ -79,7 +79,7 @@
<el-table
v-loading="rloading"
:data="remainingData"
height="200"
height="230"
style="width: calc(100% - 1.25rem)"
element-loading-text="拼命加载中"
>
@ -98,10 +98,10 @@
<el-pagination
layout="prev, pager, next"
:total="rtotal"
hide-on-single-page
:disabled="rloading"
:current-page.sync="rpage"
:page-size.sync="rpage_size"
hide-on-single-page
@current-change="remainingPageChange"
/>
</div>
@ -294,8 +294,8 @@
</el-descriptions-item>
</el-descriptions>
<div style="text-align: center;margin-top: 20px">
<el-button>取消</el-button>
<el-button type="primary">确认受邀</el-button>
<el-button @click="innerVisible=false">取消</el-button>
<el-button type="primary" @click="innerVisible=false">确认受邀</el-button>
</div>
</el-dialog>
</el-dialog>
@ -304,7 +304,8 @@
<script>
import Detail from '@/components/Detail/index'
import { home_info, home_warning_list, home_drug_remaining } from '@/api/reagent/overView'
import { home_info, home_warning_list, home_drug_remaining, get_monitoring_info } from '@/api/reagent/overView'
import { client_list } from '@/api/common'
import stringify from '@/utils/stringify'
export default {
@ -343,9 +344,10 @@ export default {
}
],
tableData: [],
options: [],
clientOptions: [],
options: ['近24小时', '近七天', '近一个月'],
value: '',
radio1: '',
radio1: 1,
gridData: [],
seach_word: '',
page: 1,
@ -356,17 +358,26 @@ export default {
object_type: '',
loadingReagent: false,
rowData: {},
remainingData: [],
rpage: 1,
rtotal: 0,
rpage_size: 15,
rclient_id: null,
rloading: false
rloading: false,
client_id: null,
client_date: 1,
linechartData: []
}
},
created() {
this.loading = true
client_list().then(
res => {
this.clientOptions = res.data.data_list
this.client_id = this.clientOptions[0].client_id
}
)
this.getMonitoringData()
home_info().then(res => {
this.initDataFunc(res.data)
this.initAllCharts()
@ -380,6 +391,22 @@ export default {
})
},
methods: {
valueChange(t, value) {
this.getMonitoringData()
this.lineCharts(t)
},
getMonitoringData() {
const data = {
client_id: this.client_id,
time_type: this.client_date,
obj_type: this.radio1
}
get_monitoring_info(stringify(data)).then(
res => {
this.linechartData = res.data
}
)
},
remainingPageChange(page) {
this.rpage = page
this.getRemainingData()
@ -478,6 +505,8 @@ export default {
{
name: 'Nightingale Chart',
type: 'pie',
radius: [8, 60],
roseType: 'area',
label: {
normal: {
show: true,
@ -490,13 +519,17 @@ export default {
}
this.myChart.setOption(option)
},
lineCharts() {
lineCharts(t) {
if (t) {
this.myChart2.clear()
} else {
this.myChart2 = this.$echarts.init(
document.getElementById('line')
)
}
const option = {
title: {
text: '最近24小时温度变化'
text: this.options[this.client_date - 1] + '温度变化'
},
tooltip: {
trigger: 'axis'
@ -506,14 +539,13 @@ export default {
show: true,
feature: {
magicType: { type: ['line', 'bar'] },
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
data: this.linechartData.map(item => item.record_date)
},
yAxis: {
type: 'value',
@ -523,11 +555,11 @@ export default {
},
series: [
{
name: '一号柜',
name: this.clientOptions.find(item => item.client_id === this.client_id).client_name,
type: 'line',
areaStyle: {},
smooth: true,
data: [10, 11, 13, 11, 12, 12, 9],
data: this.linechartData.map(item => item.data_value),
markPoint: {
data: [
{ type: 'max', name: 'Max' },
@ -641,6 +673,6 @@ export default {
}
#line{
width: 65rem;
height: 13rem;
height: 16rem;
}
</style>

Write Preview
Loading…
Cancel
Save