右侧页面样式修改,bug改正
This commit is contained in:
parent
91d482a0f4
commit
bb33cbcdb9
@ -47,6 +47,7 @@ const handleToggle = () => {
|
|||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.rightContentDrawer {
|
.rightContentDrawer {
|
||||||
|
width: 450px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@ -70,8 +71,7 @@ const handleToggle = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ant-drawer {
|
.ant-drawer {
|
||||||
margin: 5px 0px;
|
margin: 3px 0px;
|
||||||
|
|
||||||
.ant-drawer-content {
|
.ant-drawer-content {
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -47,12 +47,12 @@ const initChart = () => {
|
|||||||
// }
|
// }
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
bottom: '5%',
|
bottom: '25%',
|
||||||
right: '5%',
|
right: '2%',
|
||||||
orient: 'vertical', // 垂直排列
|
orient: 'vertical', // 垂直排列
|
||||||
data: ['已建', '在建'],
|
data: ['已建', '在建'],
|
||||||
itemWidth: 14,
|
itemWidth: 21,
|
||||||
itemHeight: 14,
|
itemHeight: 11,
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
borderRadius: 0
|
borderRadius: 0
|
||||||
},
|
},
|
||||||
@ -85,7 +85,7 @@ const initChart = () => {
|
|||||||
show: false // 不显示引导线
|
show: false // 不显示引导线
|
||||||
},
|
},
|
||||||
data: [
|
data: [
|
||||||
{ value: 80, name: '已建', itemStyle: { color: '#4CAF50' } },
|
{ value: 80, name: '已建', itemStyle: { color: '#78c300' } },
|
||||||
{ value: 20, name: '在建', itemStyle: { color: '#2196F3' } }
|
{ value: 20, name: '在建', itemStyle: { color: '#2196F3' } }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
@ -112,7 +112,7 @@ const initChart = () => {
|
|||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
data: [
|
data: [
|
||||||
{ value: 80, name: '已建', itemStyle: { color: '#4CAF50' } },
|
{ value: 80, name: '已建', itemStyle: { color: '#78c300' } },
|
||||||
{ value: 20, name: '在建', itemStyle: { color: '#2196F3' } }
|
{ value: 20, name: '在建', itemStyle: { color: '#2196F3' } }
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -67,6 +67,7 @@ onMounted(() => {
|
|||||||
border: 1px solid #edf2f8;
|
border: 1px solid #edf2f8;
|
||||||
margin-bottom: 3px;
|
margin-bottom: 3px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
padding: 0px 3px;
|
||||||
|
|
||||||
.item-content {
|
.item-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -74,10 +75,11 @@ onMounted(() => {
|
|||||||
padding: 6px 4px;
|
padding: 6px 4px;
|
||||||
|
|
||||||
.color-bar {
|
.color-bar {
|
||||||
width: 1.6px;
|
width: 2px;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
margin-right: 6px;
|
margin-right: 6px;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<!-- DataTable.vue -->
|
<!-- DataTable.vue -->
|
||||||
<template>
|
<template>
|
||||||
<div class="data-table-container">
|
<div class="data-table-container">
|
||||||
<a-table :columns="columns" :data-source="tableData" :pagination="false" size="middle" :customRow="customRow"
|
<a-table :columns="columns" :data-source="tableData" :pagination="false" size="middle" :customRow="customRow" bordered
|
||||||
class="custom-table">
|
class="custom-table">
|
||||||
</a-table>
|
</a-table>
|
||||||
</div>
|
</div>
|
||||||
@ -35,28 +35,28 @@ const columns: ColumnsType = [
|
|||||||
title: '总计',
|
title: '总计',
|
||||||
dataIndex: 'total',
|
dataIndex: 'total',
|
||||||
key: 'total',
|
key: 'total',
|
||||||
width: 65,
|
width: 70,
|
||||||
align: 'center'
|
align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '已建',
|
title: '已建',
|
||||||
dataIndex: 'built',
|
dataIndex: 'built',
|
||||||
key: 'built',
|
key: 'built',
|
||||||
width: 65,
|
width: 70,
|
||||||
align: 'center'
|
align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '在建',
|
title: '在建',
|
||||||
dataIndex: 'building',
|
dataIndex: 'building',
|
||||||
key: 'building',
|
key: 'building',
|
||||||
width: 65,
|
width: 70,
|
||||||
align: 'center'
|
align: 'center'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '未建',
|
title: '未建',
|
||||||
dataIndex: 'unbuilt',
|
dataIndex: 'unbuilt',
|
||||||
key: 'unbuilt',
|
key: 'unbuilt',
|
||||||
width: 65,
|
width: 70,
|
||||||
align: 'center'
|
align: 'center'
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
@ -212,16 +212,16 @@ onMounted(() => {
|
|||||||
.custom-table {
|
.custom-table {
|
||||||
:deep(.ant-table) {
|
:deep(.ant-table) {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
border: 1px solid #e8e8e8;
|
// border: 1px solid #d5e2ed;
|
||||||
|
border-top: 1px solid #d5e2ed;
|
||||||
.ant-table-thead {
|
.ant-table-thead {
|
||||||
>tr {
|
>tr {
|
||||||
>th {
|
>th {
|
||||||
background-color: #e5eff8 !important;
|
background-color: #e5eff8 !important;
|
||||||
color: #2f6b98;
|
color: #2f6b98;
|
||||||
// font-weight: 600;
|
// font-weight: 600;
|
||||||
border: 1px solid #e8e8e8 !important;
|
// border: 1px solid #d5e2ed!important;
|
||||||
padding: 6px 8px;
|
padding: 5px 8px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
@ -245,8 +245,8 @@ onMounted(() => {
|
|||||||
.ant-table-tbody {
|
.ant-table-tbody {
|
||||||
>tr {
|
>tr {
|
||||||
>td {
|
>td {
|
||||||
border: 1px solid #e8e8e8;
|
// border: 1px solid #d5e2ed;
|
||||||
padding: 6px 8px;
|
padding: 5px 8px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
@ -270,7 +270,7 @@ onMounted(() => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 12px 8px;
|
padding: 12px 8px;
|
||||||
border-top: 1px solid #e8e8e8;
|
// border-top: 1px solid #d5e2ed;
|
||||||
background-color: #fafafa;
|
background-color: #fafafa;
|
||||||
|
|
||||||
.footer-item {
|
.footer-item {
|
||||||
@ -293,5 +293,24 @@ onMounted(() => {
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
:deep(){
|
||||||
|
.ant-table-bordered .ant-table-tbody >tr >td{
|
||||||
|
border-bottom: 1px solid #d5e2ed !important;
|
||||||
|
border-inline-end: 1px solid #d5e2ed !important;
|
||||||
|
}
|
||||||
|
.ant-table-container{
|
||||||
|
border-inline-start: 1px solid #d5e2ed !important;
|
||||||
|
}
|
||||||
|
.ant-table-wrapper .ant-table.ant-table-bordered >.ant-table-container >.ant-table-content >table >thead >tr:not(:last-child)>th{
|
||||||
|
border-bottom: 1px solid #d5e2ed !important;
|
||||||
|
}
|
||||||
|
.ant-table-wrapper .ant-table.ant-table-bordered >.ant-table-container >.ant-table-content >table >thead>tr>th{
|
||||||
|
border-inline-end: 1px solid #d5e2ed !important;
|
||||||
|
}
|
||||||
|
.ant-table-wrapper .ant-table-thead >tr>th{
|
||||||
|
border-bottom: 1px solid #d5e2ed !important;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -6,7 +6,6 @@ import Dianxingcuoshijieshao from "@/modules/dianxingcuoshijieshao/index.vue" //
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="all_width">
|
|
||||||
<div class="moduleContent">
|
<div class="moduleContent">
|
||||||
<div class="leftContent">
|
<div class="leftContent">
|
||||||
<JidiSelectorMod />
|
<JidiSelectorMod />
|
||||||
@ -18,19 +17,5 @@ import Dianxingcuoshijieshao from "@/modules/dianxingcuoshijieshao/index.vue" //
|
|||||||
</RightDrawer>
|
</RightDrawer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style scoped lang="scss"></style>
|
||||||
.all_width{
|
|
||||||
width: 100%;
|
|
||||||
.moduleContent{
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
.rightContent{
|
|
||||||
height: 88vh;
|
|
||||||
width: 450px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -5,7 +5,6 @@ import HuanbaozdjcgzkzQK from "@/modules/huanbaozdjcgzkzQK/index.vue"
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="all_width">
|
|
||||||
<div class="moduleContent">
|
<div class="moduleContent">
|
||||||
<div class="leftContent">
|
<div class="leftContent">
|
||||||
<JidiSelectorMod />
|
<JidiSelectorMod />
|
||||||
@ -16,19 +15,5 @@ import HuanbaozdjcgzkzQK from "@/modules/huanbaozdjcgzkzQK/index.vue"
|
|||||||
</RightDrawer>
|
</RightDrawer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style scoped lang="scss"></style>
|
||||||
.all_width{
|
|
||||||
width: 100%;
|
|
||||||
.moduleContent{
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
.rightContent{
|
|
||||||
height: 88vh;
|
|
||||||
width: 450px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -6,7 +6,6 @@ import ShengtaidabiaoTwoMod from '@/modules/shengtaidabiaoTwoMod/index.vue'
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="all_width">
|
|
||||||
<div class="moduleContent">
|
<div class="moduleContent">
|
||||||
<div class="leftContent">
|
<div class="leftContent">
|
||||||
<JidiSelectorMod />
|
<JidiSelectorMod />
|
||||||
@ -18,19 +17,5 @@ import ShengtaidabiaoTwoMod from '@/modules/shengtaidabiaoTwoMod/index.vue'
|
|||||||
</RightDrawer>
|
</RightDrawer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style scoped lang="scss"></style>
|
||||||
.all_width{
|
|
||||||
width: 100%;
|
|
||||||
.moduleContent{
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
.rightContent{
|
|
||||||
height: 88vh;
|
|
||||||
width: 450px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -7,7 +7,6 @@ import XFFB from "@/modules/shengTaiLiuLiangXieFangSheShiMod/xieFangFenBu/index.
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="all_width">
|
|
||||||
<div class="moduleContent">
|
<div class="moduleContent">
|
||||||
<div class="leftContent">
|
<div class="leftContent">
|
||||||
<JidiSelectorMod />
|
<JidiSelectorMod />
|
||||||
@ -19,19 +18,5 @@ import XFFB from "@/modules/shengTaiLiuLiangXieFangSheShiMod/xieFangFenBu/index.
|
|||||||
</RightDrawer>
|
</RightDrawer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style scoped lang="scss"></style>
|
||||||
.all_width{
|
|
||||||
width: 100%;
|
|
||||||
.moduleContent{
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
.rightContent{
|
|
||||||
height: 88vh;
|
|
||||||
width: 450px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user