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 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 { } else {
try { try {
// get user info // get user info
await store.dispatch('user/getInfo') // await store.dispatch('user/getInfo')
next() next()
} catch (error) { } catch (error) {
// remove token and go to login page to re-login // 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') Message.error(error || 'Has Error')
next(`/login?redirect=${to.path}`) next(`/login?redirect=${to.path}`)
NProgress.done() NProgress.done()

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

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

Write Preview
Loading…
Cancel
Save