修好页面ui
This commit is contained in:
@@ -72,12 +72,12 @@ const info = () => {
|
||||
itemStyle: {
|
||||
color: function (params) {
|
||||
return params.value >= 90
|
||||
? '#009900'
|
||||
? '#00b07d'
|
||||
: params.value >= 80
|
||||
? '#77DA63'
|
||||
? '#2b7fd3'
|
||||
: params.value >= 70
|
||||
? '#FFCC00'
|
||||
: '#CC0000'
|
||||
? '#ffcc33'
|
||||
: '#97017e'
|
||||
}
|
||||
},
|
||||
markLine: {
|
||||
|
||||
110
src/views/pqs/runManage/runEvaluate/components/regionDetails.vue
Normal file
110
src/views/pqs/runManage/runEvaluate/components/regionDetails.vue
Normal file
@@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="区域终端运行评价详情" width="50%" draggable>
|
||||
<el-form :inline="true" :model="formInline">
|
||||
<el-form-item label="所在地市">
|
||||
<el-select v-model="formInline.value" style="width: 240px">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="运行状态">
|
||||
<el-select v-model="formInline.value1" style="width: 240px">
|
||||
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item style="position: absolute; right: 0">
|
||||
<el-button type="primary" icon="el-icon-Search">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="500px" :data="tableData">
|
||||
<vxe-column field="num" title="终端名称" />
|
||||
<vxe-column field="num1" title="所在地市" />
|
||||
<vxe-column field="num2" title="所属变电站" />
|
||||
<vxe-column field="num3" title="终端型号" />
|
||||
<vxe-column field="num4" title="完整率(%)" />
|
||||
<vxe-column field="num4" title="在线率(%)" />
|
||||
<vxe-column field="num4" title="合格率(%)" />
|
||||
<vxe-column field="num5" title="运行状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.num5 == 1" effect="dark" type="success">在运</el-tag>
|
||||
<el-tag v-if="row.num5 == 2" effect="dark" type="error">停运</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
const dialogVisible = ref(false)
|
||||
const radio1 = ref('1')
|
||||
const tableData = ref([
|
||||
{
|
||||
num: '测试终端1',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站1',
|
||||
num3: 'npqs_571_1',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
},
|
||||
{
|
||||
num: '测试终端2',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站2',
|
||||
num3: 'npqs_571_2',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
},
|
||||
{
|
||||
num: '测试终端3',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站3',
|
||||
num3: 'npqs_571_3',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
}
|
||||
])
|
||||
const formInline = reactive({
|
||||
value: '',
|
||||
value1: '',
|
||||
})
|
||||
|
||||
const options = [
|
||||
{
|
||||
value: '1',
|
||||
label: '张家口'
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '承德'
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '唐山'
|
||||
},
|
||||
{
|
||||
value: '4',
|
||||
label: '秦皇岛'
|
||||
},
|
||||
{
|
||||
value: '5',
|
||||
label: '廊坊'
|
||||
}
|
||||
]
|
||||
const options1 = [
|
||||
{
|
||||
value: '1',
|
||||
label: '在运'
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '停运'
|
||||
},
|
||||
|
||||
]
|
||||
const open = () => {
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
@@ -8,28 +8,28 @@
|
||||
|
||||
<span>完整率</span>
|
||||
<span style="color: #00cc00">98分</span>
|
||||
<span style="color: #00cc00">优</span>
|
||||
<span style="color: #00b07d">优</span>
|
||||
</div>
|
||||
<div class="appraise">
|
||||
<div class="iconfont icon-zaixianshuaibaobiao0"></div>
|
||||
|
||||
<span>在线率</span>
|
||||
<span style="color: #00cc00">98分</span>
|
||||
<span style="color: #00cc00">优</span>
|
||||
<span style="color: #00b07d">优</span>
|
||||
</div>
|
||||
<div class="appraise">
|
||||
<div class="iconfont icon-dianyahegeshuai"></div>
|
||||
|
||||
<span>合格率</span>
|
||||
<span style="color: #00cc00">98分</span>
|
||||
<span style="color: #00cc00">优</span>
|
||||
<span style="color: #00b07d">优</span>
|
||||
</div>
|
||||
<div class="appraise">
|
||||
<div class="iconfont icon-dianyahegeshuai"></div>
|
||||
<div class="iconfont icon-zonghepingjia1"></div>
|
||||
|
||||
<span>综合评价</span>
|
||||
<span style="color: #00cc00">98分</span>
|
||||
<span style="color: #00cc00">优</span>
|
||||
<span style="color: #00b07d">优</span>
|
||||
<!-- <div class="right">
|
||||
<span>综合评价</span>
|
||||
<span>优</span>
|
||||
|
||||
@@ -0,0 +1,60 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="终端统计详情" width="50%" draggable>
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="在运">
|
||||
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="500px" :data="tableData">
|
||||
<vxe-column field="num" title="终端名称" />
|
||||
<vxe-column field="num1" title="所在地市" />
|
||||
<vxe-column field="num2" title="所属变电站" />
|
||||
<vxe-column field="num3" title="终端型号" />
|
||||
<vxe-column field="num4" title="在线率(%)" />
|
||||
<vxe-column field="num5" title="运行状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.num5 == 1" effect="dark" type="success">在运</el-tag>
|
||||
<el-tag v-if="row.num5 == 2" effect="dark" type="error">停运</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="停运">Config</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
const dialogVisible = ref(false)
|
||||
const radio1 = ref('1')
|
||||
const tableData = ref([
|
||||
{
|
||||
num: '测试终端1',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站1',
|
||||
num3: 'npqs_571_1',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
},
|
||||
{
|
||||
num: '测试终端2',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站2',
|
||||
num3: 'npqs_571_2',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
},
|
||||
{
|
||||
num: '测试终端3',
|
||||
num1: '张家口',
|
||||
num2: '测试变电站3',
|
||||
num3: 'npqs_571_3',
|
||||
num4: '100',
|
||||
num5: 1
|
||||
}
|
||||
])
|
||||
const open = () => {
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
Reference in New Issue
Block a user