This commit is contained in:
parent
2a68878325
commit
f578bd4515
|
@ -2,12 +2,23 @@
|
||||||
<div class="module">
|
<div class="module">
|
||||||
<div class="displayFlex left_bg">
|
<div class="displayFlex left_bg">
|
||||||
<div class="flex1">
|
<div class="flex1">
|
||||||
<div class="yd_title" :class="zxjz ? 'left_1' : 'left_1_1'" @click="zxjzChange()" style="cursor: pointer"></div>
|
<div
|
||||||
|
class="yd_title"
|
||||||
|
:class="zxjz ? 'left_1' : 'left_1_1'"
|
||||||
|
@click="zxjzChange()"
|
||||||
|
style="cursor: pointer"
|
||||||
|
></div>
|
||||||
<div class="choose">
|
<div class="choose">
|
||||||
<div :class="jz[0].choose == '1' ? 'choose_1' : 'choose_2'" @click="jzChange(0, '1')">
|
<div
|
||||||
|
:class="jz[0].choose == '1' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(0, '1')"
|
||||||
|
>
|
||||||
教育
|
教育
|
||||||
</div>
|
</div>
|
||||||
<div :class="jz[0].choose == '2' ? 'choose_1' : 'choose_2'" @click="jzChange(0, '2')">
|
<div
|
||||||
|
:class="jz[0].choose == '2' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(0, '2')"
|
||||||
|
>
|
||||||
医疗
|
医疗
|
||||||
</div>
|
</div>
|
||||||
<!-- <div
|
<!-- <div
|
||||||
|
@ -19,7 +30,10 @@
|
||||||
</div>
|
</div>
|
||||||
<eP1 :list="data.education"></eP1>
|
<eP1 :list="data.education"></eP1>
|
||||||
<div class="choose">
|
<div class="choose">
|
||||||
<div :class="jz[1].choose == '1' ? 'choose_1' : 'choose_2'" @click="jzChange(1, '1')">
|
<div
|
||||||
|
:class="jz[1].choose == '1' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(1, '1')"
|
||||||
|
>
|
||||||
住房
|
住房
|
||||||
</div>
|
</div>
|
||||||
<!-- <div
|
<!-- <div
|
||||||
|
@ -35,7 +49,7 @@
|
||||||
临时救助
|
临时救助
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<eP2 :list="data.housing" ></eP2>
|
<eP2 :list="data.housing"></eP2>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="displayFlex center_bg">
|
<div class="displayFlex center_bg">
|
||||||
|
@ -56,7 +70,12 @@
|
||||||
<span>金额(元)</span>
|
<span>金额(元)</span>
|
||||||
<!-- <span>数据对比</span> -->
|
<!-- <span>数据对比</span> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="rolling">
|
<div
|
||||||
|
class="rolling"
|
||||||
|
ref="mainRef"
|
||||||
|
@mouseenter="stopAutoScroll"
|
||||||
|
@mouseleave="startAutoScroll"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
v-for="(item, index) in data.lifeAssistance.subsidyInformation"
|
v-for="(item, index) in data.lifeAssistance.subsidyInformation"
|
||||||
:key="index"
|
:key="index"
|
||||||
|
@ -74,13 +93,22 @@
|
||||||
<div class="flex1">
|
<div class="flex1">
|
||||||
<div class="yd_title right_1"></div>
|
<div class="yd_title right_1"></div>
|
||||||
<div class="choose">
|
<div class="choose">
|
||||||
<div :class="jz[2].choose == '1' ? 'choose_1' : 'choose_2'" @click="jzChange(2, '1')">
|
<div
|
||||||
|
:class="jz[2].choose == '1' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(2, '1')"
|
||||||
|
>
|
||||||
困难残疾人
|
困难残疾人
|
||||||
</div>
|
</div>
|
||||||
<div :class="jz[2].choose == '2' ? 'choose_1' : 'choose_2'" @click="jzChange(2, '2')">
|
<div
|
||||||
|
:class="jz[2].choose == '2' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(2, '2')"
|
||||||
|
>
|
||||||
困难军人
|
困难军人
|
||||||
</div>
|
</div>
|
||||||
<div :class="jz[2].choose == '3' ? 'choose_1' : 'choose_2'" @click="jzChange(2, '3')">
|
<div
|
||||||
|
:class="jz[2].choose == '3' ? 'choose_1' : 'choose_2'"
|
||||||
|
@click="jzChange(2, '3')"
|
||||||
|
>
|
||||||
困难职工
|
困难职工
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -89,7 +117,11 @@
|
||||||
<div class="flex1">
|
<div class="flex1">
|
||||||
<div class="yd_title right_2"></div>
|
<div class="yd_title right_2"></div>
|
||||||
<div class="dyh">
|
<div class="dyh">
|
||||||
<div class="czr-bj" v-for="(item, index) in data.diversification.hszhxms" :key="index">
|
<div
|
||||||
|
class="czr-bj"
|
||||||
|
v-for="(item, index) in data.diversification.hszhxms"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<div class="czrBox">
|
<div class="czrBox">
|
||||||
<div>发起单位:</div>
|
<div>发起单位:</div>
|
||||||
<div>{{ item.fqdw }}</div>
|
<div>{{ item.fqdw }}</div>
|
||||||
|
@ -197,7 +229,7 @@ const getData = async () => {
|
||||||
await http.get("/api/ggfwyth/succour").then((res) => {
|
await http.get("/api/ggfwyth/succour").then((res) => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
console.log(res.data);
|
console.log(res.data);
|
||||||
data.diversification.hszhxms = res.data.diversification.hszhxms
|
data.diversification.hszhxms = res.data.diversification.hszhxms;
|
||||||
// 专项救助模块
|
// 专项救助模块
|
||||||
// 教育&医疗
|
// 教育&医疗
|
||||||
data.education.data = res.data.specialAssistance.education.data;
|
data.education.data = res.data.specialAssistance.education.data;
|
||||||
|
@ -221,9 +253,42 @@ const getData = async () => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
//自动滚动
|
||||||
|
const mainRef = ref(null);
|
||||||
|
let isAutoScrolling = true;
|
||||||
|
|
||||||
|
const stopAutoScroll = () => {
|
||||||
|
isAutoScrolling = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
const startAutoScroll = () => {
|
||||||
|
isAutoScrolling = true;
|
||||||
|
autoScroll();
|
||||||
|
};
|
||||||
|
|
||||||
|
const autoScroll = () => {
|
||||||
|
if (!isAutoScrolling) return;
|
||||||
|
|
||||||
|
const mainEl = mainRef.value;
|
||||||
|
mainEl.scrollTop += 1; // 每次滚动的距离
|
||||||
|
|
||||||
|
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {
|
||||||
|
setTimeout(() => {
|
||||||
|
mainEl.scrollTo({ top: 0, behavior: "smooth" });
|
||||||
|
setTimeout(autoScroll, 2000); // 2秒后再次滚动到底部
|
||||||
|
}, 1000); // 暂停1秒后开始快速滚回顶部
|
||||||
|
} else {
|
||||||
|
requestAnimationFrame(autoScroll);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => {
|
||||||
getData();
|
getData();
|
||||||
});
|
});
|
||||||
|
onMounted(() => {
|
||||||
|
startAutoScroll();
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -757,32 +822,29 @@ onBeforeMount(() => {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
.czr-bj {
|
.czr-bj {
|
||||||
width: 480px;
|
width: 480px;
|
||||||
// height: calc(100% - 26px);
|
// height: calc(100% - 26px);
|
||||||
background: rgba(0, 103, 165, 0.18);
|
background: rgba(0, 103, 165, 0.18);
|
||||||
box-shadow: inset 0px 0px 58px 0px rgba(37, 175, 252, 0.47);
|
box-shadow: inset 0px 0px 58px 0px rgba(37, 175, 252, 0.47);
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding: 20px 26px 1px 32px;
|
padding: 20px 26px 1px 32px;
|
||||||
margin: 0 auto 12px;
|
margin: 0 auto 12px;
|
||||||
// box-sizing: border-box;
|
// box-sizing: border-box;
|
||||||
|
|
||||||
.czrBox {
|
.czrBox {
|
||||||
height: 22px;
|
height: 22px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: #FFFFFF;
|
color: #ffffff;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
letter-spacing: 3px;
|
letter-spacing: 3px;
|
||||||
text-shadow: 0px 0px 17px rgba(0, 255, 254, 0.5);
|
text-shadow: 0px 0px 17px rgba(0, 255, 254, 0.5);
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.school {
|
.school {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -830,7 +892,7 @@ onBeforeMount(() => {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
// padding-left: 6px;
|
padding-left: 6px;
|
||||||
|
|
||||||
.fundingContent {
|
.fundingContent {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
Loading…
Reference in New Issue