个人中心-预警通知列表页面开发

This commit is contained in:
付民康
2025-03-15 10:58:18 +08:00
parent 1efb34722f
commit e5b2e4d08a
4 changed files with 131 additions and 19 deletions

View File

@@ -117,11 +117,29 @@
background: transparent;
li {
background: #F3F3F3;
//background: #F3F3F3;
background: transparent;
}
.active {
background: #ffffff !important;
//background: #ffffff !important;
}
}
}
.jyh-tabs-4 {
.devui-tabs__nav {
background: transparent;
li {
background: transparent;
padding: 8px 0;
margin-right: 24px;
}
.active {
background: transparent !important;
border: 0px !important;
border-bottom: 2px solid black !important;
}
}
}
@@ -246,3 +264,11 @@
text-align: left;
}
}
.devui-status:before {
margin-right: 12px;
}
.yellow-status:before {
background-color: #FAC20A !important;
}

View File

@@ -1,28 +1,20 @@
<template>
<div class="version-info">
<Card simple class="jyh-card mt-3">
<div class="card-title">预警通知列表</div>
<div class="mb-3">
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="licenseTableData"
>
<d-column field="code" header="编号"></d-column>
<d-column field="name" header="名称"></d-column>
<d-column field="detail" header="描述"></d-column>
</d-table>
</div>
</Card>
<d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-4" type="wrapped" v-model="selectTab">
<d-tab id="gryj" title="个人预警通知列表"></d-tab>
<d-tab id="zzyj" title="组织预警通知列表"></d-tab>
</d-tabs>
<EarlyWarningPerson v-if="selectTab==='gryj'"/>
<EarlyWarningOrganization v-if="selectTab==='zzyj'"/>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const licenseTableData = ref([{code: '05822156', name:'MIT License',detail: 'integer'}]);
const CopyrightTableData = ref([{code: '05822156',detail: 'integer'}]);
import EarlyWarningPerson from './EarlyWarningPerson.vue';
import EarlyWarningOrganization from './EarlyWarningOrganization.vue';
const selectTab = ref('gryj');
</script>

View File

@@ -0,0 +1,47 @@
<template>
<Card simple class="jyh-card mt-3">
<div class="card-title">组织预警通知列表</div>
<div class="mb-3">
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="licenseTableData"
>
<d-column field="code" header="时间"></d-column>
<d-column field="name" header="标题">
<template #default="scope">
<a>{{scope.row.name}}</a>
</template>
</d-column>
<d-column field="detail" header="详情"></d-column>
<d-column field="level" header="级别">
<template #default="scope,text">
<d-status v-if="scope.row.level===4" type="error">危险</d-status>
<d-status v-if="scope.row.level===3" type="warning">严重</d-status>
<d-status v-if="scope.row.level===2" class="yellow-status">一般</d-status>
<d-status v-if="scope.row.level===1" type="running">提示</d-status>
</template>
</d-column>
</d-table>
</div>
</Card>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const licenseTableData = ref([
{code: '05822156', name:'MIT License',detail: 'integer',level: 4},
{code: '05822156', name:'MIT License',detail: 'integer',level: 3},
{code: '05822156', name:'MIT License',detail: 'integer',level: 2},
{code: '05822156', name:'MIT License',detail: 'integer',level: 1},
]);
</script>
<style scoped lang="scss">
@import 'devui-theme/styles-var/devui-var.scss';
</style>

View File

@@ -0,0 +1,47 @@
<template>
<Card simple class="jyh-card mt-3">
<div class="card-title">个人预警通知列表</div>
<div class="mb-3">
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="licenseTableData"
>
<d-column field="code" header="时间"></d-column>
<d-column field="name" header="标题">
<template #default="scope">
<a>{{scope.row.name}}</a>
</template>
</d-column>
<d-column field="detail" header="详情"></d-column>
<d-column field="level" header="级别">
<template #default="scope,text">
<d-status v-if="scope.row.level===4" type="error">危险</d-status>
<d-status v-if="scope.row.level===3" type="warning">严重</d-status>
<d-status v-if="scope.row.level===2" class="yellow-status">一般</d-status>
<d-status v-if="scope.row.level===1" type="running">提示</d-status>
</template>
</d-column>
</d-table>
</div>
</Card>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const licenseTableData = ref([
{code: '05822156', name:'MIT License',detail: 'integer',level: 4},
{code: '05822156', name:'MIT License',detail: 'integer',level: 3},
{code: '05822156', name:'MIT License',detail: 'integer',level: 2},
{code: '05822156', name:'MIT License',detail: 'integer',level: 1},
]);
</script>
<style scoped lang="scss">
@import 'devui-theme/styles-var/devui-var.scss';
</style>