fix: BUG修改
This commit is contained in:
kun
parent
c4baa93c41
commit
6b5c63f9c6
@ -39,7 +39,7 @@
|
||||
:stripe="stripe"
|
||||
:row-key="getRowKeys"
|
||||
@selection-change="selectionChange"
|
||||
:header-cell-style="{ fontWeight: 500 }"
|
||||
:header-cell-style="{ fontWeight: 500, backgroundColor: 'transparent' }"
|
||||
:cell-style="{ fontSize: '12px' }"
|
||||
class="protable"
|
||||
>
|
||||
@ -95,6 +95,7 @@
|
||||
:background="background"
|
||||
/>
|
||||
</slot>
|
||||
<changeTheme />
|
||||
</div>
|
||||
<!-- 列设置 -->
|
||||
<ColSetting v-if="toolButton" ref="colRef" v-model:colSetting="colSetting" />
|
||||
@ -114,6 +115,7 @@ import Pagination from "./components/Pagination.vue";
|
||||
import ColSetting from "./components/ColSetting.vue";
|
||||
import TableColumn from "./components/TableColumn.vue";
|
||||
import printJS from "print-js";
|
||||
import changeTheme from "@/components/changeTheme/index.vue";
|
||||
|
||||
interface ProTableProps extends Partial<Omit<TableProps<any>, "data">> {
|
||||
columns: ColumnProps[]; // 列配置项
|
||||
|
||||
@ -49,6 +49,7 @@ const gridRef = ref();
|
||||
width: 200px;
|
||||
}
|
||||
.card {
|
||||
background-color: #092945;
|
||||
box-shadow: none;
|
||||
}
|
||||
// :deep(.el-form-item--default) {
|
||||
|
||||
@ -23,5 +23,8 @@ const { changePrimary } = useTheme();
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
img:not(:first-child) {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -25,7 +25,8 @@
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
overflow-x: hidden;
|
||||
background-color: var(--el-fill-color-blank);
|
||||
background-color: #092945;
|
||||
// background-color: var(--el-fill-color-blank);
|
||||
// border: 1px solid var(--el-border-color-light);
|
||||
border-radius: 8px;
|
||||
// box-shadow: 0 0 12px rgb(0 0 0 / 5%);
|
||||
@ -91,6 +92,7 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
position: relative;
|
||||
|
||||
// table-search 表格搜索样式
|
||||
.table-search {
|
||||
@ -103,7 +105,16 @@
|
||||
.el-form-item__content > * {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-input__wrapper {
|
||||
background-color: transparent;
|
||||
box-shadow: 0 0 0 1px var(--el-color-primary, var(--el-color-primary)) inset;
|
||||
}
|
||||
.el-input__inner {
|
||||
color: white;
|
||||
}
|
||||
// 去除时间选择器上下 padding
|
||||
.el-range-editor.el-input__wrapper {
|
||||
padding: 0 10px;
|
||||
@ -134,23 +145,60 @@
|
||||
|
||||
// el-table 表格样式
|
||||
.el-table {
|
||||
background-color: transparent;
|
||||
flex: 1;
|
||||
|
||||
// 修复 safari 浏览器表格错位 https://github.com/HalseySpicy/Geeker-Admin/issues/83
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
tr {
|
||||
background-color: transparent;
|
||||
}
|
||||
td.el-table__cell {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
th.el-table__cell {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
td.el-table-fixed-column--right {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.el-table__header {
|
||||
background-color: #09405f;
|
||||
// background: url("@/assets/images/layoutImg/tableThead.png") no-repeat 0 0;
|
||||
// background-size: 100% 100%;
|
||||
}
|
||||
.el-table__header th {
|
||||
height: 60px;
|
||||
font-size: 14px;
|
||||
|
||||
// font-weight: bold;
|
||||
color: #333333;
|
||||
background: var(--el-fill-color-light);
|
||||
color: var(--el-color-primary);
|
||||
// background: var(--el-fill-color-light);
|
||||
}
|
||||
.el-table__row:nth-child(2n) {
|
||||
height: 60px;
|
||||
font-size: 14px;
|
||||
background-color: #09314e;
|
||||
// background: url("@/assets/images/layoutImg/tableTwoN.png") no-repeat 0 0;
|
||||
// background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.el-table__row:nth-child(2n-1) {
|
||||
height: 60px;
|
||||
font-size: 14px;
|
||||
// background-color: transparent !important;
|
||||
}
|
||||
|
||||
.el-table__row:hover {
|
||||
background-color: #09405f;
|
||||
// background: url("@/assets/images/layoutImg/TableHover.png") no-repeat 0 0;
|
||||
// background-size: 100% 100%;
|
||||
}
|
||||
.el-table__row {
|
||||
height: 60px;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
// 设置 el-table 中 header 文字不换行，并省略
|
||||
@ -185,6 +233,44 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
.el-pagination__goto {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-pagination__classifier {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-input__wrapper {
|
||||
color: var(--el-color-primary);
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
box-shadow: 0 0 0 1px var(--el-color-primary, var(--el-color-primary)) inset;
|
||||
height: 26px;
|
||||
}
|
||||
.el-input__inner {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-pager li {
|
||||
color: var(--el-color-primary);
|
||||
border: none;
|
||||
height: 26px;
|
||||
}
|
||||
.el-pager li:active {
|
||||
color: var(--el-color-primary);
|
||||
border: none;
|
||||
height: 26px;
|
||||
}
|
||||
.el-pagination__total {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.btn-prev,
|
||||
.btn-next,
|
||||
.btn-prev:disabled,
|
||||
.btn-next:disabled {
|
||||
color: var(--el-color-primary);
|
||||
background-color: transparent;
|
||||
border: 1px solid var(--el-color-primary);
|
||||
height: 26px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -19,7 +19,6 @@
|
||||
</el-button>
|
||||
</template>
|
||||
</ProTable>
|
||||
<changeTheme />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -29,7 +28,6 @@ import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import changeTheme from "@/components/changeTheme/index.vue";
|
||||
import { getRoleList, getTreemRoleList, getTreeByIdList } from "@/api/modules/project";
|
||||
import { GlobalStore } from "@/stores";
|
||||
|
||||
|
||||
@ -1,14 +1,5 @@
|
||||
<template>
|
||||
<div class="table-box">
|
||||
<div class="statistics-top">
|
||||
<div class="sta-item" v-for="(item, index) in statisticsOption" :key="index">
|
||||
<div class="sta-num">
|
||||
<span>{{ item.name }}</span>
|
||||
<span>{{ item.value ? item.value : 0 }}</span>
|
||||
</div>
|
||||
<img :src="item.img" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="table">
|
||||
<ProTable
|
||||
ref="proTable"
|
||||
@ -56,39 +47,7 @@ import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import Pagination from "@/components/ProTable/components/Pagination.vue";
|
||||
import transformInfo from "./components/transformInfo.vue";
|
||||
import { statisticsInfo, statisticsTable } from "@/api/modules/project";
|
||||
const statisticsOption = ref([
|
||||
{
|
||||
name: "累计下达整改单",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/整改单.png", import.meta.url).href,
|
||||
prop: "inspectNum"
|
||||
},
|
||||
{
|
||||
name: "累计下达停工单",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/停工单.png", import.meta.url).href,
|
||||
prop: "shutdownNum"
|
||||
},
|
||||
{
|
||||
name: "累计问题数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/问题数.png", import.meta.url).href,
|
||||
prop: "questionNum"
|
||||
},
|
||||
{
|
||||
name: "累计闭合问题数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/闭合问题数.png", import.meta.url).href,
|
||||
prop: "solveNum"
|
||||
},
|
||||
{
|
||||
name: "总检查次数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/总检查次数.png", import.meta.url).href,
|
||||
prop: "recordNum"
|
||||
}
|
||||
]);
|
||||
import { statisticsTable } from "@/api/modules/project";
|
||||
// 表格配置项
|
||||
const columns: ColumnProps[] = [
|
||||
{ type: "index", label: "序号", width: 80 },
|
||||
@ -166,60 +125,10 @@ const dataCallback = (data: any) => {
|
||||
pageSize: Number(data.size)
|
||||
};
|
||||
};
|
||||
// 获取顶部统计信息
|
||||
const getInfo = async () => {
|
||||
const res = await statisticsInfo({ type: 2 });
|
||||
statisticsOption.value.map(item => {
|
||||
item.value = res.result[item.prop];
|
||||
});
|
||||
console.log(res);
|
||||
};
|
||||
onMounted(() => {
|
||||
getInfo();
|
||||
});
|
||||
onMounted(() => {});
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.table-box {
|
||||
.statistics-top {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.sta-item:not(:last-child) {
|
||||
margin-right: 28px;
|
||||
}
|
||||
.sta-item {
|
||||
min-width: 310px;
|
||||
height: 113px;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
border-radius: 8px 8px 8px 8px;
|
||||
opacity: 1;
|
||||
display: flex;
|
||||
margin-bottom: 20px;
|
||||
.sta-num {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
margin-left: 42px;
|
||||
margin-right: auto;
|
||||
span:first-child {
|
||||
font-size: 16px;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
color: #6b7275;
|
||||
}
|
||||
span:last-child {
|
||||
font-size: 32px;
|
||||
font-family: OPPOSans-Heavy, OPPOSans;
|
||||
font-weight: 800;
|
||||
color: #2e3038;
|
||||
}
|
||||
}
|
||||
> img {
|
||||
width: 44px;
|
||||
height: 40px;
|
||||
margin-right: 22px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table {
|
||||
position: relative;
|
||||
z-index: 500;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="overview">
|
||||
<el-dialog :show-close="false" v-model="visible1" :style="dialogStyle" @close="closeMain">
|
||||
<el-dialog :show-close="false" append-to-body v-model="visible1" :style="dialogStyle" @close="closeMain">
|
||||
<template #title>
|
||||
<div class="title-detail">
|
||||
<img src="@/assets/images/tableIcon/look.png" alt="" />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user