xiangshan
/
ggfwjsc
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

gx

This commit is contained in:
duanxiaohai 2024-05-27 15:48:31 +08:00
parent 2a68878325
commit f578bd4515
1 changed files with 97 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
src/view/work.vue
View File

@ -2,12 +2,23 @@
<div class="module">
<div class="displayFlex left_bg">
<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="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 :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
@ -19,7 +30,10 @@
</div>
<eP1 :list="data.education"></eP1>
<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
@ -35,7 +49,7 @@
临时救助
</div>
</div>
<eP2 :list="data.housing" ></eP2>
<eP2 :list="data.housing"></eP2>
</div>
</div>
<div class="displayFlex center_bg">
@ -56,7 +70,12 @@
<span>金额(元)</span>
<!-- <span>数据对比</span> -->
</div>
<div class="rolling">
<div
class="rolling"
ref="mainRef"
@mouseenter="stopAutoScroll"
@mouseleave="startAutoScroll"
>
<div
v-for="(item, index) in data.lifeAssistance.subsidyInformation"
:key="index"
@ -74,13 +93,22 @@
<div class="flex1">
<div class="yd_title right_1"></div>
<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 :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 :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>
@ -89,7 +117,11 @@
<div class="flex1">
<div class="yd_title right_2"></div>
<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>发起单位:</div>
<div>{{ item.fqdw }}</div>
@ -197,7 +229,7 @@ const getData = async () => {
await http.get("/api/ggfwyth/succour").then((res) => {
if (res.code == 200) {
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;
@ -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(() => {
getData();
});
onMounted(() => {
startAutoScroll();
});
</script>
<style lang="scss" scoped>
@ -757,32 +822,29 @@ onBeforeMount(() => {
width: 100%;
.czr-bj {
width: 480px;
// height: calc(100% - 26px);
background: rgba(0, 103, 165, 0.18);
box-shadow: inset 0px 0px 58px 0px rgba(37, 175, 252, 0.47);
border-radius: 2px;
padding: 20px 26px 1px 32px;
margin: 0 auto 12px;
// box-sizing: border-box;
width: 480px;
// height: calc(100% - 26px);
background: rgba(0, 103, 165, 0.18);
box-shadow: inset 0px 0px 58px 0px rgba(37, 175, 252, 0.47);
border-radius: 2px;
padding: 20px 26px 1px 32px;
margin: 0 auto 12px;
// box-sizing: border-box;
.czrBox {
height: 22px;
font-weight: 500;
font-size: 16px;
color: #FFFFFF;
line-height: 22px;
letter-spacing: 3px;
text-shadow: 0px 0px 17px rgba(0, 255, 254, 0.5);
display: flex;
justify-content: space-between;
margin-bottom: 20px;
.czrBox {
height: 22px;
font-weight: 500;
font-size: 16px;
color: #ffffff;
line-height: 22px;
letter-spacing: 3px;
text-shadow: 0px 0px 17px rgba(0, 255, 254, 0.5);
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
}
}
}
.school {
display: flex;
@ -830,7 +892,7 @@ onBeforeMount(() => {
display: flex;
flex-direction: column;
align-items: center;
// padding-left: 6px;
padding-left: 6px;
.fundingContent {
display: flex;