徐景良 2024-07-10 11:10:17 +08:00
commit 4cac900d9d
5 changed files with 56 additions and 37 deletions

View File

@ -28,7 +28,7 @@
:options="props.batchOptions" :options="props.batchOptions"
/> />
</div> </div>
<div class="screen-item"> <div class="screen-item" style="margin-bottom:0px;">
<div class="screen-item-label">类型</div> <div class="screen-item-label">类型</div>
<a-select <a-select
allowClear allowClear
@ -37,11 +37,11 @@
:options="markTypeOptions" :options="markTypeOptions"
/> />
</div> </div>
<div class="screen-item" style="width: 44.4%"> <div class="screen-item" style="width: 44.4%;margin-bottom:0px;">
<div class="screen-item-label">图斑号</div> <div class="screen-item-label">图斑号</div>
<a-input v-model:value="params.geomid" style="flex: 1" /> <a-input v-model:value="params.geomid" style="flex: 1" />
</div> </div>
<div class="screen-item" style="width: 22.2%;display: flex; justify-content: end"> <div class="screen-item" style="width: 22.2%;display: flex; justify-content: end;margin-bottom: 0px;">
<a-button type="primary" :icon="h(SearchOutlined)" @click="query"></a-button> <a-button type="primary" :icon="h(SearchOutlined)" @click="query"></a-button>
</div> </div>
</div> </div>
@ -86,7 +86,7 @@
/> />
</div> </div>
</div> </div>
<div class="data-list-div"> <div class="data-list-div" style="padding-top: 3px;">
<div <div
v-for="(item, index) in dataList" v-for="(item, index) in dataList"
:key="index" :key="index"
@ -105,7 +105,10 @@
</div> </div>
<div class="item-mark" v-if="item.is_build_name">{{item.is_build_name}}</div> <div class="item-mark" v-if="item.is_build_name">{{item.is_build_name}}</div>
</div> </div>
<div class="data-item-type-div" :style="`border-color:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'}`"> <div
class="data-item-type-div"
:style="`border-color:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'}`"
@click="goAudit(item)">
<div> <div>
<div class="type-title">举证</div> <div class="type-title">举证</div>
<div class="type-data" :style="`background:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'};`"> <div class="type-data" :style="`background:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'};`">
@ -116,19 +119,19 @@
</div> </div>
<div class="data-list-info-div"> <div class="data-list-info-div">
<div class="info-layout-div"> <div class="info-layout-div">
<div class="info-item"> <div class="info-item" style="width: 79px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.area}}</div> <div class="info-data">{{item.area}}</div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 79px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.gengdi_area}}</div> <div class="info-data">{{item.gengdi_area}}</div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 90px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.yongjiujibennongtian_area}}</div> <div class="info-data">{{item.yongjiujibennongtian_area}}</div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 90px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.nongyongdi_area}}</div> <div class="info-data">{{item.nongyongdi_area}}</div>
</div> </div>
@ -447,16 +450,16 @@
flex-direction: column; flex-direction: column;
} }
.screen-div { .screen-div {
padding: 10px; padding: 10px 10px 19px 10px;
display: flex; display: flex;
width: 100%; width: 565px;
// margin-top: 10px; // margin-top: 10px;
flex-wrap: wrap; flex-wrap: wrap;
// background: @component-background; // background: @component-background;
.screen-item { .screen-item {
width: 33.3%; width: 33.3%;
display: flex; display: flex;
margin-bottom: 3px; margin-bottom: 15px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 500; font-weight: 500;
font-size: 17px; font-size: 17px;
@ -477,11 +480,11 @@
} }
.sift-div{ .sift-div{
background:#fff; background:#fff;
height: 60px; height: 77px;
padding:19px 13px; padding:19px 13px;
margin-left: 10px; margin-left: 10px;
margin-right: 10px; margin-right: 10px;
border-radius: 10px; border-radius: 10px 10px 0px 0px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.layout-div{ .layout-div{
@ -530,8 +533,8 @@
.data-list-item{ .data-list-item{
background:#fff; background:#fff;
padding:10px; padding:10px;
border-radius:6px; // border-radius:6px;
margin-bottom:10px; margin-bottom:4px;
.data-list-layout-div{ .data-list-layout-div{
display:flex; display:flex;
justify-content: space-between; justify-content: space-between;
@ -583,6 +586,8 @@
width: 37px; width: 37px;
height: 37px; height: 37px;
border-radius: 4px; border-radius: 4px;
cursor: pointer;
user-select: none;
.type-title{ .type-title{
display:flex; display:flex;
align-items:center; align-items:center;
@ -639,7 +644,11 @@
} }
} }
} }
} }
.data-list-item:nth-last-child(1){
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
} }
.pagination-div { .pagination-div {
background: @component-background; background: @component-background;

View File

@ -195,7 +195,8 @@
height: 100%; height: 100%;
display: flex; display: flex;
.show-list { .show-list {
width: 35%; width: 565px;
background: #EFEFEF;
} }
.map-box-div { .map-box-div {
width: 65%; width: 65%;

View File

@ -24,7 +24,6 @@
</div> </div>
</div> </div>
<div class="data-list"> <div class="data-list">
<!-- <div class="data-title">图斑列表</div> -->
<div class="show-data-list-content"> <div class="show-data-list-content">
<div class="data-item" v-for="(item, index) in dataList" :key="index" @click="emits('showInfo',true,item)"> <div class="data-item" v-for="(item, index) in dataList" :key="index" @click="emits('showInfo',true,item)">
<div class="name-div"> <div class="name-div">

View File

@ -70,7 +70,7 @@
@change="(value) => emits('mapListScreenChange',value,'streetId')" @change="(value) => emits('mapListScreenChange',value,'streetId')"
/> />
</div> </div>
<div class="screen-item" style="width:43.3%"> <div class="screen-item" style="width:40%">
<a-input <a-input
style="flex:1;margin-left: 10px;" style="flex:1;margin-left: 10px;"
v-model:value="props.infoScreenData.mapNo" v-model:value="props.infoScreenData.mapNo"
@ -177,7 +177,7 @@
/> />
</div> </div>
</div> </div>
<div class="data-list-div"> <div class="data-list-div" style="padding-top: 1px;">
<div v-for="(item, index) in props.infoDataList" :key="index" class="data-list-item"> <div v-for="(item, index) in props.infoDataList" :key="index" class="data-list-item">
<div class="data-list-layout-div"> <div class="data-list-layout-div">
<div class="data-list-title-div"> <div class="data-list-title-div">
@ -191,26 +191,26 @@
</div> </div>
<div class="item-mark" v-if="item.isbuildname">{{item.isbuildname}}</div> <div class="item-mark" v-if="item.isbuildname">{{item.isbuildname}}</div>
</div> </div>
<div class="data-item-type-div"> <div class="data-item-type-div" style="cursor:pointer;" @click="() => {}">
{{item.unitname}} {{item.unitname}}
</div> </div>
</div> </div>
<div class="data-list-info-div"> <div class="data-list-info-div">
<div class="info-layout-div"> <div class="info-layout-div">
<div class="info-item"> <div class="info-item" style="width: 67px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.area}}</div> <div class="info-data">{{item.area}}</div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 67px;">
<div class="info-label"></div> <div class="info-label"></div>
<div class="info-data">{{item.gengdiarea}}</div> <div class="info-data">{{item.gengdiarea}}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
<div class="info-label"></div> <div class="info-label" style="width: 80px;"></div>
<div class="info-data">{{item.yongjiujibennongtianarea}}</div> <div class="info-data">{{item.yongjiujibennongtianarea}}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
<div class="info-label"></div> <div class="info-label" style="width: 80px;"></div>
<div class="info-data">{{item.nongyongdiarea}}</div> <div class="info-data">{{item.nongyongdiarea}}</div>
</div> </div>
</div> </div>
@ -422,12 +422,12 @@ const showInfo = (item) => {
.screen-div{ .screen-div{
padding: 10px; padding: 10px;
display: flex; display: flex;
width: 100%; width:565px;
flex-wrap: wrap; flex-wrap: wrap;
.screen-item{ .screen-item{
width: 33.3%; width: 33.3%;
display: flex; display: flex;
margin-bottom: 3px; margin-bottom: 12px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 500; font-weight: 500;
font-size: 17px; font-size: 17px;
@ -451,25 +451,25 @@ const showInfo = (item) => {
} }
.top-radio-button-div{ .top-radio-button-div{
width:100%; width:100%;
padding:10px 10px 0px 10px; padding:33px 10px 8px 10px;
.radio-item{ .radio-item{
width:50%; width:50%;
text-align: center; text-align: center;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 400; font-weight: 400;
font-size: 20px; font-size: 20px;
height: 37px; height: 40px;
line-height: 37px; line-height: 40px;
user-select: none; user-select: none;
} }
} }
.sift-div{ .sift-div{
background:#fff; background:#fff;
height: 60px; height: 77px;
padding:19px 13px; padding:19px 13px;
margin-left: 10px; margin-left: 10px;
margin-right: 10px; margin-right: 10px;
border-radius: 10px; border-radius: 10px 10px 0px 0px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.layout-div{ .layout-div{
@ -516,8 +516,8 @@ const showInfo = (item) => {
.data-list-item{ .data-list-item{
background:#fff; background:#fff;
padding:10px; padding:10px;
border-radius:6px; // border-radius:6px;
margin-bottom:10px; margin-bottom:1px;
.data-list-layout-div{ .data-list-layout-div{
display:flex; display:flex;
justify-content: space-between; justify-content: space-between;
@ -567,6 +567,8 @@ const showInfo = (item) => {
color: #696969; color: #696969;
display: flex; display: flex;
align-items: center; align-items: center;
cursor:pointer;
user-select: none;
} }
} }
.data-list-info-div{ .data-list-info-div{
@ -612,6 +614,10 @@ const showInfo = (item) => {
} }
} }
} }
.data-list-item:nth-last-child(1){
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px
}
} }
.pagination-div{ .pagination-div{
height: 60px; height: 60px;

View File

@ -66,7 +66,7 @@ function onMapboxLoad():void {
mapConfig.value = JSON.parse(res.codeValue) mapConfig.value = JSON.parse(res.codeValue)
}) })
} }
const showInfo = ref(false) const showInfo = ref(true)
const year = ref<number>() const year = ref<number>()
const batch = ref() const batch = ref()
const dataList = ref<any>([]) const dataList = ref<any>([])
@ -429,6 +429,9 @@ const resetScreenData = () => {
infoScreenData.value.markType = '' infoScreenData.value.markType = ''
getInfoList() getInfoList()
} }
onMounted(() => {
getInfoList()
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -437,7 +440,8 @@ const resetScreenData = () => {
height: 100%; height: 100%;
display: flex; display: flex;
.show-list{ .show-list{
width: 52%; width: 565px;
background: #EFEFEF;
:deep(.ant-spin-nested-loading){ :deep(.ant-spin-nested-loading){
height: 100%; height: 100%;
} }