首页样式修改

This commit is contained in:
caoqianming 2022-10-10 15:09:19 +08:00
parent 8ffd379964
commit dc7b9e2f91
1 changed files with 50 additions and 73 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<el-row :gutter="6"> <el-row :gutter="6">
<el-col :md="4" :sm="24"> <el-col :md="3" :sm="24">
<el-card shadow="hover"> <el-card shadow="hover">
<template #header> <template #header>
<div class="card-header"> <div class="card-header">
@ -9,20 +9,15 @@
</template> </template>
<div class="card-body"> <div class="card-body">
<div v-for="item in dutyAgg" :key="item.workflow"> <div v-for="item in dutyAgg" :key="item.workflow">
<el-badge :value="item.count" class="item"> <el-badge :value="item.count" class="item">
<el-button <el-button icon="el-icon-promotion" type="primary" size="small" @click="toTicket"></el-button>
icon="el-icon-promotion" </el-badge>
type="primary" <div style="font-size:12px">{{ item.workflow__name }}</div>
size="small"
@click="toTicket"
></el-button>
</el-badge>
<div style="font-size:12px">{{ item.workflow__name }}</div>
</div>
</div> </div>
</div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :md="12" :sm="24"> <el-col :md="13" :sm="24">
<el-card shadow="hover"> <el-card shadow="hover">
<template #header> <template #header>
<div class="card-header"> <div class="card-header">
@ -31,75 +26,47 @@
</div> </div>
</template> </template>
<div style="height:340px"> <div style="height:340px">
<scTable <scTable ref="table" :apiObj="apiObj" :params="params" row-key="id" fit stripe hideDo>
ref="table" <!-- <el-table-column label="#" type="index" width="50"></el-table-column> -->
:apiObj="apiObj" <el-table-column label="事件种类">
:params="params" <template #default="scope">
row-key="id" <el-span v-for="item in scope.row.cates_" :key="item.id" :label="item.name" :value="item.id">{{
fit item.name }}/</el-span>
stripe </template>
hideDo </el-table-column>
> <el-table-column label="发生区域" prop="area_.name"></el-table-column>
<el-table-column label="#" type="index" width="50"></el-table-column> <el-table-column label="当事人" prop="employee_.name">
<el-table-column label="事件种类"> <template #default="scope">
<template #default="scope"> <span v-if="scope.row.employee && scope.row.obj_cate == 'people'">{{ scope.row.employee_.name }}</span>
<el-span <span v-else>未知人员</span>
v-for="item in scope.row.cates_" </template>
:key="item.id" </el-table-column>
:label="item.name"
:value="item.id"
>{{ item.name }}</el-span
>
</template>
</el-table-column>
<el-table-column label="发生区域" prop="area_.name"></el-table-column>
<el-table-column label="当事人" prop="employee_.name">
<template #default="scope">
<span
v-if="scope.row.employee && scope.row.obj_cate == 'people'"
>{{ scope.row.employee_.name }}</span
>
<span v-else>未知人员</span>
</template>
</el-table-column>
<el-table-column label="人员类型" prop="employee_.type"> <!-- <el-table-column label="人员类型" prop="employee_.type">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.employee && scope.row.obj_cate == 'people'"> <span v-if="scope.row.employee && scope.row.obj_cate == 'people'">
<span <span v-if="
v-if="
scope.row.employee_.type != '' && scope.row.employee_.type != '' &&
scope.row.employee_.type == 'employee' scope.row.employee_.type == 'employee'
" ">正式员工</span>
>正式员工</span <span v-if="
>
<span
v-if="
scope.row.employee_.type != '' && scope.row.employee_.type != '' &&
scope.row.employee_.type == 'remployee' scope.row.employee_.type == 'remployee'
" ">相关方</span>
>相关方</span <span v-if="
>
<span
v-if="
scope.row.employee_.type != '' && scope.row.employee_.type != '' &&
scope.row.employee_.type == 'visitor' scope.row.employee_.type == 'visitor'
" ">访客</span>
>访客</span </span>
> </template>
</span> </el-table-column> -->
</template> <el-table-column label="发生时间" prop="create_time"></el-table-column>
</el-table-column>
<el-table-column
label="发生时间"
prop="create_time"
></el-table-column>
<!-- <el-table-column <!-- <el-table-column
label="处理人" label="处理人"
prop="handle_user_name" prop="handle_user_name"
></el-table-column> --> ></el-table-column> -->
</scTable> </scTable>
</div> </div>
</el-card> </el-card>
@ -162,13 +129,21 @@ export default {
tooltip: { tooltip: {
trigger: "item", trigger: "item",
}, },
legend: {
// orient: 'vertical',
left: 'center'
},
series: [ series: [
{ {
name: "事件分类", name: "事件分类",
type: "pie", type: "pie",
radius: ["40%", "70%"], radius: ["40%", "70%"],
center: ["50%", "60%"], center: ["50%", "60%"],
label: false, label: {
formatter: '{c}',
position: 'inside',
color: 'white'
},
data: this.postOptions, data: this.postOptions,
}, },
], ],
@ -255,16 +230,18 @@ export default {
text-align: center; text-align: center;
margin: 40px 0 20px 0; margin: 40px 0 20px 0;
} }
.card-header { .card-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height:24px; height: 24px;
} }
.card-body { .card-body {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-around; justify-content: space-around;
height:340px; height: 340px;
} }
</style> </style>