This commit is contained in:
parent
ef0ec678aa
commit
23f8aa0b4d
Binary file not shown.
After Width: | Height: | Size: 113 KiB |
Binary file not shown.
After Width: | Height: | Size: 111 KiB |
Binary file not shown.
After Width: | Height: | Size: 108 KiB |
Binary file not shown.
After Width: | Height: | Size: 107 KiB |
Binary file not shown.
After Width: | Height: | Size: 112 KiB |
Binary file not shown.
After Width: | Height: | Size: 111 KiB |
|
@ -961,45 +961,46 @@ const getData = () => {
|
|||
|
||||
.left_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbx_ylbxffrc.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_1.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_1_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbx_ylbxje.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.left_2 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/gllrbt_btrc.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_3.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_2_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/gllrbt_btje.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_4.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.left_3 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/tkdb_ffrc.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_5.png);
|
||||
// background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_3_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/tkdb_bzje.png);
|
||||
background-image: url(@/assets/images/yl/ylbt_6.png);
|
||||
// background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
.center_1 {
|
||||
background-image: url(@/assets/images/yl/new_lnrzb.png);
|
||||
background-repeat: no-repeat;
|
||||
|
|
175
src/view/yl.vue
175
src/view/yl.vue
|
@ -2,38 +2,15 @@
|
|||
<div class="module">
|
||||
<div class="displayFlex left_bg">
|
||||
<div class="flex1">
|
||||
<div class="yd_title left_1">
|
||||
<div
|
||||
class="yd_title"
|
||||
:class="leftchoose.first == '1' ? 'left_1' : 'left_1_1'"
|
||||
@click="change2('first')"
|
||||
>
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
<span class="text">
|
||||
<img
|
||||
v-if="leftchoose.first == '1'"
|
||||
src="@/assets/images/ylbx_1.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/ylbx_1_1.png"
|
||||
class="c"
|
||||
@click="change('first', '1')"
|
||||
/>
|
||||
<img
|
||||
v-if="leftchoose.first == '2'"
|
||||
src="@/assets/images/ylbx_1.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/ylbx_2_1.png"
|
||||
class="c"
|
||||
@click="change('first', '2')"
|
||||
style="height: 35px; width: 120px; margin-right: 10px"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<ePie
|
||||
v-if="leftchoose.first == '1' && showEchart"
|
||||
|
@ -49,37 +26,12 @@
|
|||
></ePie2>
|
||||
</div>
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title left_2">
|
||||
<div class="yd_title " :class="leftchoose.second == '1' ? 'left_2' : 'left_2_1'"
|
||||
@click="change2('second')">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
<span class="text">
|
||||
<img
|
||||
v-if="leftchoose.second == '1'"
|
||||
src="@/assets/images/gllrbt_1.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/gllrbt_1_1.png"
|
||||
class="c"
|
||||
@click="change('second', '1')"
|
||||
/>
|
||||
<img
|
||||
v-if="leftchoose.second == '2'"
|
||||
src="@/assets/images/gllrbt_2.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/gllrbt_2_1.png"
|
||||
class="c"
|
||||
@click="change('second', '2')"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<eP2
|
||||
v-if="leftchoose.second == '1' && showEchart"
|
||||
|
@ -95,37 +47,15 @@
|
|||
/>
|
||||
</div>
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title left_3">
|
||||
<div
|
||||
class="yd_title"
|
||||
:class="leftchoose.third == '1' ? 'left_3' : 'left_3_1'"
|
||||
@click="change2('third')"
|
||||
>
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
<span class="text">
|
||||
<img
|
||||
v-if="leftchoose.third == '1'"
|
||||
src="@/assets/images/tkjz_1.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/tkjz_1_1.png"
|
||||
class="c"
|
||||
@click="change('third', '1')"
|
||||
/>
|
||||
<img
|
||||
v-if="leftchoose.third == '2'"
|
||||
src="@/assets/images/tkjz_2.png"
|
||||
class="c"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
src="@/assets/images/tkjz_2_1.png"
|
||||
class="c"
|
||||
@click="change('third', '2')"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<eP3
|
||||
v-if="leftchoose.third == '1' && showEchart"
|
||||
|
@ -424,6 +354,13 @@ const pagination = reactive({
|
|||
const change = (name, index) => {
|
||||
leftchoose.value[name] = index;
|
||||
};
|
||||
const change2 = (name) => {
|
||||
if (leftchoose.value[name] == "0") {
|
||||
leftchoose.value[name] = "1";
|
||||
} else {
|
||||
leftchoose.value[name] = "0";
|
||||
}
|
||||
};
|
||||
const chooseVillage = (village) => {
|
||||
tableType.title = village;
|
||||
tableType.columns = xz_column.value;
|
||||
|
@ -789,18 +726,18 @@ const getData = () => {
|
|||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
font-size: 16px;
|
||||
font-family: SourceHanSansCN;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 1px;
|
||||
align-items: center;
|
||||
}
|
||||
// .text {
|
||||
// display: flex;
|
||||
// position: absolute;
|
||||
// font-size: 16px;
|
||||
// font-family: SourceHanSansCN;
|
||||
// font-weight: bold;
|
||||
// color: #ffffff;
|
||||
// position: absolute;
|
||||
// right: 5px;
|
||||
// top: 1px;
|
||||
// align-items: center;
|
||||
// }
|
||||
|
||||
.c {
|
||||
width: 130px;
|
||||
|
@ -939,22 +876,64 @@ const getData = () => {
|
|||
}
|
||||
|
||||
.left_1 {
|
||||
background-image: url(@/assets/images/yl/new_ylbx.png);
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_1.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_1_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.left_2 {
|
||||
background-image: url(@/assets/images/yl/new_gllrbt.png);
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_3.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_2_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_4.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.left_3 {
|
||||
background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_5.png);
|
||||
// background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.left_3_1 {
|
||||
cursor: pointer;
|
||||
background-image: url(@/assets/images/yl/ylbt_6.png);
|
||||
// background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
// .left_1 {
|
||||
// background-image: url(@/assets/images/yl/new_ylbx.png);
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
// }
|
||||
|
||||
// .left_2 {
|
||||
// background-image: url(@/assets/images/yl/new_gllrbt.png);
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
// }
|
||||
|
||||
// .left_3 {
|
||||
// background-image: url(@/assets/images/yl/new_tklrjz.png);
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
// }
|
||||
|
||||
.center_1 {
|
||||
background-image: url(@/assets/images/yl/new_lnrzb.png);
|
||||
|
@ -1531,4 +1510,4 @@ const getData = () => {
|
|||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue