山大课题数据库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

60 lines
1.7 KiB

<script setup>
import { computed, ref, watch, defineProps, defineEmits } from 'vue';
import { useStore } from 'vuex';
const props = defineProps({ status: Object });
defineEmits(['search']);
const store = useStore();
const devices = computed(() => store.state.device.devices); // 设备/站点列表
const deviceId = ref(''); // 选中的设备id
const currentDeviceId = computed(() => store.state.device.currentDeviceId); // 正在操作的设备的id
// const get = computed(() => (props.status.get ? '设置生效' : '等待下发'));
// const set = computed(() => (props.status.set ? '设置生效' : '等待下发'));
const statusType = computed(() => {
let type = 'success';
switch (props.status) {
case 'PENDING':
type = 'primary';
break;
case 'FAIL':
type = 'danger';
break;
case 'SUCCESS':
type = 'success';
break;
default:
type = 'primary';
break;
}
return type;
});
// 监听currentDeviceId
watch(
() => currentDeviceId.value,
newValue => {
if (newValue && deviceId.value !== newValue) {
deviceId.value = newValue;
}
},
{ immediate: true },
);
</script>
<template>
<div class="mb-3">
<span class="text-sm text-gray-500">选择站点</span>
<el-select v-model="deviceId" placeholder="选择站点" @change="$emit('search', deviceId)">
<el-option v-for="item in devices" :key="item.deviceId" :label="item.address" :value="item.deviceId"></el-option>
</el-select>
<!-- <span class="text-sm text-gray-500 ml-10">获取状态:</span>
<el-tag type="success">{{ get }}</el-tag>-->
<span class="text-sm text-gray-500 ml-10">设置状态:</span>
<el-tag :type="statusType">{{ props.status || 'PENDING' }}</el-tag>
</div>
</template>