【数据大屏】80%
Zhufu
parent
337b0c5e39
commit
35ad6b7313
|
|
@ -0,0 +1,13 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="11px" height="14px" viewBox="0 0 11 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>形状</title>
|
||||
<g id="监测平台" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="财源一体化平台A-切图" transform="translate(-533.000000, -219.000000)" fill="#0653D8" fill-rule="nonzero">
|
||||
<g id="弹窗" transform="translate(516.000000, 175.000000)">
|
||||
<g id="文字信息list" transform="translate(16.000000, 21.548027)">
|
||||
<path d="M6.50000278,26.7979183 C6.05771178,26.7979183 5.6424624,26.9672852 5.32896287,27.2770218 C5.0178662,27.5835196 4.84333527,27.9999412 4.84404477,28.4340059 C4.84333527,28.8680706 5.0178662,29.2844922 5.32896287,29.59099 C5.63918414,29.8983526 6.06066479,30.0707886 6.50000278,30.0700876 C6.93934077,30.0707886 7.36082141,29.8983526 7.67104268,29.59099 C7.98270088,29.2848637 8.15733327,28.8682 8.15596667,28.4340059 C8.15596667,27.9970237 7.98454221,27.5867585 7.67104268,27.2770218 C7.36119745,26.9691044 6.93947179,26.7965681 6.50000278,26.7979183 L6.50000278,26.7979183 Z M11.5654952,26.2445664 C11.2871091,25.6102845 10.8856948,25.0360046 10.3839136,24.554147 C9.88062342,24.0679512 9.28728015,23.6820567 8.63629123,23.4175404 C7.95912431,23.1402373 7.23302993,22.9983314 6.5000055,23.0000148 C5.75933723,23.0000148 5.04067164,23.1404076 4.36371433,23.4166347 C3.71305643,23.6815652 3.11981627,24.067239 2.61609196,24.5527885 C2.11468567,25.0347848 1.71332134,25.6088394 1.4345104,26.2427551 C1.14687533,26.8972045 0.998960604,27.6032362 1.0000055,28.3167226 C1.0000055,29.3482724 1.24980234,30.3752938 1.74067661,31.365636 C2.13530101,32.1617134 2.68713351,32.9374135 3.38150747,33.6750758 C4.56904735,34.9339469 5.81387881,35.7037601 6.16725328,35.9102512 C6.37140431,36.0299163 6.62539292,36.0299163 6.82954395,35.9102512 C7.18291842,35.704213 8.42774988,34.9343997 9.61528976,33.6750758 C10.310122,32.938772 10.8619545,32.1617134 11.2561206,31.365636 C11.7502032,30.3766523 11.9999945,29.3514422 11.9999945,28.3185339 C11.9999945,27.5998906 11.8533281,26.9016247 11.5654952,26.2445664 Z M6.50000278,31.0047294 C5.56210209,31.0170276 4.69007011,30.5297149 4.21748963,29.7292053 C3.74490916,28.9286957 3.74490916,27.9388633 4.21748963,27.1383537 C4.69007011,26.3378441 5.56210209,25.8505313 6.50000278,25.8628296 C7.92368129,25.8814976 9.06787978,27.0270653 9.06787978,28.4337795 C9.06787978,29.8404936 7.92368129,30.9860613 6.50000278,31.0047294 L6.50000278,31.0047294 Z" id="形状"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
|
|
@ -2,5 +2,6 @@
|
|||
"dashboard": "Dashboard",
|
||||
"about": "关于",
|
||||
"workbench": "工作台",
|
||||
"analysis": "分析页"
|
||||
"analysis": "分析页",
|
||||
"dataScreen": "数据大屏"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,6 +23,15 @@ const dashboard: AppRouteModule = {
|
|||
title: t('routes.dashboard.analysis'),
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/dashboard/dataScreen',
|
||||
name: 'DataScreen',
|
||||
component: () => import('@/views/dashboard/dataScreen/index.vue'),
|
||||
meta: {
|
||||
// affix: true,
|
||||
title: t('routes.dashboard.dataScreen'),
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/formCallPage',
|
||||
name: 'formCallPage',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,574 @@
|
|||
<template>
|
||||
<div class="map"></div>
|
||||
<div class="data-screen">
|
||||
<div class="basic-data">
|
||||
<div class="title">基本数据</div>
|
||||
<div class="show-quantity-div">
|
||||
<div class="number-1 show-span-div">
|
||||
<div class="show-quantity">
|
||||
<div class="sub-title">企业总数</div>
|
||||
<div class="show-number">3157</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="number-2 show-span-div">
|
||||
<div class="show-quantity">
|
||||
<div class="sub-title">测算土地面积</div>
|
||||
<div class="show-number">6360<span class="suffix">㎡</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="number-3 show-span-div">
|
||||
<div class="show-quantity">
|
||||
<div class="sub-title">测算房产面积</div>
|
||||
<div class="show-number">3157<span class="suffix">㎡</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="enterprise-area">
|
||||
<div class="title">企业占地面积分乡镇情况</div>
|
||||
<div class="enterprise-area-bar"></div>
|
||||
</div>
|
||||
<div class="enterprise-income">
|
||||
<div class="title">企业收入分镇情况</div>
|
||||
<div class="enterprise-income-bar"></div>
|
||||
</div>
|
||||
<div class="area-pie-div">
|
||||
<div class="title">企业占地面积（土地、房产）</div>
|
||||
<div class="area-pie">
|
||||
<div class="land-area">
|
||||
<div class="pie-title">土地面积占比</div>
|
||||
<div class="land-area-pie"></div>
|
||||
</div>
|
||||
<div class="real-estate-area">
|
||||
<div class="pie-title">房产面积占比</div>
|
||||
<div class="real-estate-area-pie"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pack-up"></div>
|
||||
</div>
|
||||
<div class="search-div">
|
||||
<a-input-search
|
||||
class="search-input"
|
||||
v-model:value="value"
|
||||
placeholder="请输入企业名称/法人/地址搜索"
|
||||
size="large"
|
||||
@search="onSearch"
|
||||
>
|
||||
<template #enterButton>
|
||||
<a-button class="search-button" type="primary" :icon="h(SearchOutlined)">搜索</a-button>
|
||||
</template>
|
||||
</a-input-search>
|
||||
<div class="show-search-list">
|
||||
<div class="show-search-title"></div>
|
||||
<div class="show-search-content">
|
||||
<div class="show-search-item" v-for="(item, index) in searchList" :key="index">
|
||||
<div style="width:100%;color:#D3F1FF">
|
||||
<div style="display:flex;justify-content: space-between;margin-bottom: 8px">
|
||||
<div class="item-name">{{item.name}}</div>
|
||||
<div class="item-person-name">{{item.personName}}</div>
|
||||
</div>
|
||||
<div class="item-address"><img :src="'dataScreen/address.svg'" style="margin-right: 10px"/>{{item.address}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="show-enterprise-info"></div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import * as echarts from 'echarts';
|
||||
import { onMounted, ref, h } from 'vue';
|
||||
import { SearchOutlined } from '@ant-design/icons-vue'
|
||||
// import address from ''
|
||||
let enterpriseAreaBarChartOption = {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['上冶镇', '薛庄镇', '探沂镇', '朱田镇', '梁邱镇', '新庄镇', '马庄镇','胡阳镇','石井镇','东蒙镇'],
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
interval: 0,
|
||||
color: "#D0DEEE",
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
type: "value",
|
||||
show: false
|
||||
}],
|
||||
series: [
|
||||
{
|
||||
name: '土地面积',
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
barGap: "0%",
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.1)'
|
||||
},
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(102, 225, 223, 1)'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: 'rgba(102, 225, 223, 0.5)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(102, 225, 223, 0)'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
data: [18203, 23489, 29034, 104970, 131744, 630230, 104860,29034, 104970, 131744]
|
||||
},
|
||||
{
|
||||
name: '房产面积',
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.1)'
|
||||
},
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(255, 183, 66, 1)'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: 'rgba(255, 183, 66, 0.5)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(255, 183, 66, 0)'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
data: [19325, 23438, 31000, 121594, 134141, 681807, 9034, 104970, 131744, 630230,]
|
||||
}
|
||||
],
|
||||
grid: {
|
||||
top: '20%',
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '17%',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
top: '5%',
|
||||
right: "5%",
|
||||
textStyle: {
|
||||
color: "#D0DEEE",
|
||||
fontSize: 12
|
||||
},
|
||||
},
|
||||
};
|
||||
let enterpriseIncomeBarChartOption = {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['上冶镇', '薛庄镇', '探沂镇', '朱田镇', '梁邱镇', '新庄镇', '马庄镇','胡阳镇','石井镇','东蒙镇'],
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
interval: 0,
|
||||
color: "#D0DEEE",
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
type: "value",
|
||||
show: false
|
||||
}],
|
||||
series: [
|
||||
{
|
||||
name: '测算收入',
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
barGap: "0%",
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.1)'
|
||||
},
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(52, 220, 254, 1)'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: 'rgba(52, 220, 254, 0.5)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(52, 220, 254, 0)'
|
||||
}
|
||||
]
|
||||
},
|
||||
borderRadius: [8, 8, 0, 0],
|
||||
},
|
||||
data: [18203, 23489, 29034, 104970, 131744, 630230, 104860,29034, 104970, 131744]
|
||||
},
|
||||
{
|
||||
name: '实缴收入',
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.1)'
|
||||
},
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(84, 107, 255, 1)'
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: 'rgba(84, 107, 255, 0.5)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(84, 107, 255, 0)'
|
||||
}
|
||||
]
|
||||
},
|
||||
borderRadius: [8, 8, 0, 0],
|
||||
},
|
||||
data: [19325, 23438, 31000, 121594, 134141, 681807, 9034, 104970, 131744, 630230,]
|
||||
}
|
||||
],
|
||||
grid: {
|
||||
top: '20%',
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '17%',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
top: '5%',
|
||||
right: "5%",
|
||||
textStyle: {
|
||||
color: "#D0DEEE",
|
||||
fontSize: 12
|
||||
},
|
||||
},
|
||||
};
|
||||
let landAreaPieChartOption = {
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
right: "right",
|
||||
data: ["≥40亩", "30-40亩", "20-30亩", "10-20亩", "0-10亩"],
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
},
|
||||
itemWidth: 6,
|
||||
itemHeight: 6,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
right: "30%",
|
||||
type: 'pie',
|
||||
radius: ['30%', '85%'],
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inner',
|
||||
color:'#fff',
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '≥40亩',itemStyle: {color: "#12CEFF"} },
|
||||
{ value: 735, name: '30-40亩',itemStyle: {color: "#FFBD00"} },
|
||||
{ value: 580, name: '20-30亩',itemStyle: {color: "#1257FF"} },
|
||||
{ value: 484, name: '10-20亩',itemStyle: {color: "#73D85A"} },
|
||||
{ value: 300, name: '0-10亩',itemStyle: {color: "#161BF6"} }
|
||||
],
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
let realEstateAreaPieChartOption = {
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
right: "right",
|
||||
data: ["≥100㎡", "80-100㎡", "50-80㎡", "20-50㎡", "0-20㎡"],
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
},
|
||||
itemWidth: 6,
|
||||
itemHeight: 6,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
right: "30%",
|
||||
type: 'pie',
|
||||
radius: ['30%', '85%'],
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inner',
|
||||
color:'#fff',
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '≥100㎡',itemStyle: {color: "#04C7FF"} },
|
||||
{ value: 735, name: '80-100㎡',itemStyle: {color: "#FF12CE"} },
|
||||
{ value: 580, name: '50-80㎡',itemStyle: {color: "#FF6700"} },
|
||||
{ value: 484, name: '20-50㎡',itemStyle: {color: "#161BF6"} },
|
||||
{ value: 300, name: '0-20㎡',itemStyle: {color: "#5202FF"} }
|
||||
],
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
onMounted(() => {
|
||||
let enterpriseAreaBarDom = document.getElementsByClassName('enterprise-area-bar')[0]
|
||||
let enterpriseIncomeBarDom = document.getElementsByClassName('enterprise-income-bar')[0]
|
||||
let landAreaPieDom = document.getElementsByClassName('land-area-pie')[0]
|
||||
let realEstateAreaPieDom = document.getElementsByClassName('real-estate-area-pie')[0]
|
||||
|
||||
let enterpriseAreaBarChart = echarts.init(enterpriseAreaBarDom)
|
||||
let enterpriseIncomeBarChart = echarts.init(enterpriseIncomeBarDom)
|
||||
let landAreaPieChart = echarts.init(landAreaPieDom)
|
||||
let realEstateAreaPieChart = echarts.init(realEstateAreaPieDom)
|
||||
|
||||
enterpriseAreaBarChart.setOption(enterpriseAreaBarChartOption);
|
||||
enterpriseIncomeBarChart.setOption(enterpriseIncomeBarChartOption);
|
||||
landAreaPieChart.setOption(landAreaPieChartOption);
|
||||
realEstateAreaPieChart.setOption(realEstateAreaPieChartOption);
|
||||
})
|
||||
const value = ref("")
|
||||
const searchList = ref([
|
||||
{ name: '隆兴板材厂A', personName: '刘明', address: '临沂市费县探沂镇209国道石行村' },
|
||||
{ name: '隆兴板材厂B', personName: '刘明', address: '临沂市费县探沂镇209国道石行村' },
|
||||
{ name: '隆兴板材厂C', personName: '刘明', address: '临沂市费县探沂镇209国道石行村' },
|
||||
])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.map{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #4E7243;
|
||||
}
|
||||
.data-screen{
|
||||
height:100%;
|
||||
width: 466px;
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding-top: 25px;
|
||||
padding-left: 19px;
|
||||
padding-right: 29px;
|
||||
.title{
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
background: url(/dataScreen/title.png) no-repeat;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 32px;
|
||||
}
|
||||
.show-quantity-div{
|
||||
padding-top:16px;
|
||||
padding-bottom: 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.show-span-div{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 50px;
|
||||
.sub-title{
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
}
|
||||
.show-number{
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
color: #17B0CC;
|
||||
.suffix{
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.number-1{
|
||||
width: 129px;
|
||||
height: 55px;
|
||||
background: url(/dataScreen/number1.png) no-repeat;
|
||||
}
|
||||
.number-2{
|
||||
width: 129px;
|
||||
height: 55px;
|
||||
background: url(/dataScreen/number2.png) no-repeat;
|
||||
}
|
||||
.number-3{
|
||||
width: 129px;
|
||||
height: 55px;
|
||||
background: url(/dataScreen/number3.png) no-repeat;
|
||||
}
|
||||
}
|
||||
.enterprise-area{
|
||||
.enterprise-area-bar{
|
||||
width: 100%;
|
||||
height: 193px;
|
||||
}
|
||||
}
|
||||
.enterprise-income{
|
||||
.enterprise-income-bar{
|
||||
width: 100%;
|
||||
height: 193px;
|
||||
}
|
||||
}
|
||||
.area-pie-div{
|
||||
.area-pie{
|
||||
display: flex;
|
||||
margin-top: 7px;
|
||||
.land-area{
|
||||
flex: 1;
|
||||
.land-area-pie{
|
||||
height:165px;
|
||||
}
|
||||
}
|
||||
.real-estate-area{
|
||||
flex: 1;
|
||||
.real-estate-area-pie{
|
||||
height: 165px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pie-title{
|
||||
width: 108px;
|
||||
height: 27px;
|
||||
background: url(/dataScreen/pie-title.png) no-repeat;
|
||||
font-size: 14px;
|
||||
color:#fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.pack-up{
|
||||
width: 34px;
|
||||
height: 130px;
|
||||
background: url(/dataScreen/pack-up.png) no-repeat;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
transform: translate(100%, -50%);
|
||||
}
|
||||
}
|
||||
.search-div{
|
||||
width: 370px;
|
||||
height: 47px;
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: calc(466px + 50px);
|
||||
.show-search-list{
|
||||
position: absolute;
|
||||
top: 47px;
|
||||
width: 100%;
|
||||
height: 280px;
|
||||
background: #032567;
|
||||
.show-search-title{
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #0542B7;
|
||||
}
|
||||
.show-search-content{
|
||||
width: 100%;
|
||||
height: 275px;
|
||||
overflow: auto;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
.show-search-item{
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
border-bottom: 1px dashed #90A1B0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.item-name{
|
||||
font-size: 16px;
|
||||
}
|
||||
.item-person-name{
|
||||
font-size: 14px;
|
||||
}
|
||||
.item-address{
|
||||
font-size: 12px;
|
||||
opacity: 0.56;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.show-enterprise-info{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 265px;
|
||||
height: 307px;
|
||||
background: url(/dataScreen/show-enterprise-info.png) no-repeat;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.search-div{
|
||||
.search-input{
|
||||
input::placeholder{
|
||||
color: rgba(255, 255, 255, 0.63)
|
||||
}
|
||||
input{
|
||||
background-color: #121C2D;
|
||||
border: 1px solid #103A84;
|
||||
color: rgba(255, 255, 255, 0.63);
|
||||
border-radius: 20px;
|
||||
}
|
||||
button.css-dev-only-do-not-override-n9spb6.ant-btn.ant-btn-primary.ant-btn-lg.search-button.ant-input-search-button{
|
||||
border-top-right-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
background: #0A44AD;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue