97 lines
2.3 KiB
Vue
97 lines
2.3 KiB
Vue
<style lang='scss' scoped>
|
|
.headerSelect-list-picker{
|
|
background-color: #fff;
|
|
display: flex;
|
|
box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.08);
|
|
&-alarm{
|
|
border-right: 1px solid #eee;
|
|
}
|
|
&-alarm,&-state{
|
|
width: 50%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding: 26rpx 0;
|
|
}
|
|
}
|
|
</style>
|
|
<template>
|
|
<view class="headerSelect">
|
|
<view class="headerSelect-list-picker">
|
|
<view class="headerSelect-list-picker-alarm" @click="alarmSelectShow = true">
|
|
<text>{{(alarmSelectValue) =='WARNING'?"预警":(alarmSelectValue)=='ALARM'?"报警":"-"}}</text>
|
|
<u-icon name="arrow-down" class="pl10" color="#c0c4cc"></u-icon>
|
|
</view>
|
|
<view class="headerSelect-list-picker-state" @click="stateSelectShow = true">
|
|
<text>{{stateSelectValue=="UNPROCESS"?"未处理":stateSelectValue=="PROCESSED"?"已处理":"状态"}}</text>
|
|
<u-icon name="arrow-down" class="pl10" color="#c0c4cc"></u-icon>
|
|
</view>
|
|
</view>
|
|
<u-select v-model="alarmSelectShow" :list="alarmSelectList" @confirm="onAlarmConfirmFn"></u-select>
|
|
<u-select v-model="stateSelectShow" :list="stateSelectList" @confirm="onStateConfirmFn"></u-select>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
alarmSelectValue:"",
|
|
alarmSelectShow: false, // 报警预警弹框
|
|
alarmSelectList: [
|
|
{
|
|
value: "ALARM",
|
|
label: '报警'
|
|
},
|
|
{
|
|
value: "WARNING",
|
|
label: '预警'
|
|
}
|
|
],
|
|
stateSelectValue:"",
|
|
stateSelectShow: false, // 状态弹框
|
|
stateSelectList: [
|
|
{
|
|
value: "",
|
|
label: '全部'
|
|
},
|
|
{
|
|
value: "UNPROCESS",
|
|
label: '未处理'
|
|
},
|
|
{
|
|
value: "PROCESSED",
|
|
label: '已处理'
|
|
}
|
|
],
|
|
}
|
|
},
|
|
props:{
|
|
alarmValue:{
|
|
type:String,
|
|
default:"ALARM"
|
|
},
|
|
stateValue:{
|
|
type:String,
|
|
default:""
|
|
},
|
|
},
|
|
created() {
|
|
console.log(this.alarmValue,this.stateValue);
|
|
this.alarmSelectValue = this.alarmValue;
|
|
this.stateSelectValue = this.stateValue;
|
|
},
|
|
methods: {
|
|
// 状态选择
|
|
onStateConfirmFn(arr){
|
|
this.stateSelectValue = arr[0].value;
|
|
this.$emit("onStateConfirm",arr[0].value);
|
|
},
|
|
// 报警预警选择
|
|
onAlarmConfirmFn(arr){
|
|
this.alarmSelectValue = arr[0].value;
|
|
this.$emit("onAlarmConfirm",arr[0].value);
|
|
},
|
|
}
|
|
}
|
|
</script>
|