zhangzl
/
nsgk_mobile
2
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

阳光村务

wulanhaote
张泽亮 3 years ago
parent
139c80be5e
commit
29acc1cdf0
5 changed files with 772 additions and 772 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +153
    -153
      src/views/sunVillage/dynamic/injoint/assetsPublic.vue
  2. +100
    -100
      src/views/sunVillage/dynamic/injoint/index.vue
  3. +153
    -153
      src/views/sunVillage/dynamic/injoint/publicResources.vue
  4. +164
    -164
      src/views/sunVillage/equity/info.vue
  5. +202
    -202
      src/views/sunVillage/equity/shareBonus.vue

+ 153
- 153
src/views/sunVillage/dynamic/injoint/assetsPublic.vue View File

@@ -1,153 +1,153 @@
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="3"></projectNav>
<div class="public_details">
<div class="search_wrap">
<div class="search_ipt">
<input type="text" placeholder="请输入查询信息" class="ipt" />
</div>
<div class="search_btn">查询</div>
</div>
<div class="table_wrap">
<div class="head_main">
<div class="flex f1">资产名称</div>
<div class="flex f2">数量</div>
<div class="flex f3">性质</div>
<div class="flex f4">构建时间</div>
</div>
<div class="tbody_main">
<div
class="item_list"
@click="skip('/sunVillage/injoint/assetsPublic_desc')"
>
<div class="flex f1">18号大楼1233</div>
<div class="flex f2">1</div>
<div class="flex f3">经营</div>
<div class="flex f4">2022/02/25</div>
</div>
<div
class="item_list"
@click="skip('/sunVillage/injoint/assetsPublic_desc')"
>
<div class="flex f1">18号大楼1233</div>
<div class="flex f2">1</div>
<div class="flex f3">经营</div>
<div class="flex f4">2022/02/25</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.public_details {
margin: 20px 24px 0;
.search_wrap {
height: 84px;
display: flex;
border-bottom: 1px solid #e6e6e6;
.search_ipt {
flex: 1;
display: flex;
padding: 0 20px;
.ipt {
flex: 1;
font-size: 34px;
}
}
.search_btn {
width: 110px;
font-size: 34px;
color: #b3b3b3;
display: flex;
justify-content: center;
align-items: center;
border-left: 1px solid #e6e6e6;
}
}
.table_wrap {
.head_main {
height: 76px;
display: flex;
color: #bababa;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
&.f1 {
flex: 4;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 4;
}
}
}
.tbody_main {
.item_list {
height: 150px;
display: flex;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&.f1 {
flex: 4;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 4;
}
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillageInjoint",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="3"></projectNav>
<div class="public_details">
<div class="search_wrap">
<div class="search_ipt">
<input type="text" placeholder="请输入查询信息" class="ipt" />
</div>
<div class="search_btn">查询</div>
</div>
<div class="table_wrap">
<div class="head_main">
<div class="flex f1">资产名称</div>
<div class="flex f2">数量</div>
<div class="flex f3">性质</div>
<div class="flex f4">构建时间</div>
</div>
<div class="tbody_main">
<div
class="item_list"
@click="skip('/sunVillage/injoint/assetsPublic_desc')"
>
<div class="flex f1">3号厂房</div>
<div class="flex f2">1</div>
<div class="flex f3">经营</div>
<div class="flex f4">2022/02/25</div>
</div>
<div
class="item_list"
@click="skip('/sunVillage/injoint/assetsPublic_desc')"
>
<div class="flex f1">丰田小汽车</div>
<div class="flex f2">1</div>
<div class="flex f3">经营</div>
<div class="flex f4">2022/02/25</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.public_details {
margin: 20px 24px 0;
.search_wrap {
height: 84px;
display: flex;
border-bottom: 1px solid #e6e6e6;
.search_ipt {
flex: 1;
display: flex;
padding: 0 20px;
.ipt {
flex: 1;
font-size: 34px;
}
}
.search_btn {
width: 110px;
font-size: 34px;
color: #b3b3b3;
display: flex;
justify-content: center;
align-items: center;
border-left: 1px solid #e6e6e6;
}
}
.table_wrap {
.head_main {
height: 76px;
display: flex;
color: #bababa;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
&.f1 {
flex: 4;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 4;
}
}
}
.tbody_main {
.item_list {
height: 150px;
display: flex;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&.f1 {
flex: 4;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 4;
}
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillageInjoint",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>

+ 100
- 100
src/views/sunVillage/dynamic/injoint/index.vue View File

@@ -1,100 +1,100 @@
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="1"></projectNav>
<div class="focus_news">
<div class="news_img">
<img src="@/assets/images/sunVillage/8.jpg" />
</div>
<div class="news_title">村一季度财务情况公布</div>
</div>
<div class="news_list">
<ul>
<li class="item_block" @click="skip('/sunVillage/injoint/details')">
<div class="title">一季度收入说明</div>
<div class="insets">
<img src="@/assets/images/sunVillage/2.jpg" />
</div>
</li>
<li class="item_block" @click="skip('/sunVillage/injoint/details')">
<div class="title">一季度收入说明</div>
<div class="insets">
<img src="@/assets/images/sunVillage/2.jpg" />
</div>
</li>
</ul>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.focus_news {
margin: 20px 24px 16px;
.news_img {
width: 702px;
height: 256px;
img {
width: 100%;
height: 100%;
}
}
.news_title {
font-size: 24px;
margin-top: 16px;
}
}
.news_list {
li {
display: flex;
height: 146px;
justify-content: center;
align-items: center;
padding: 0 33px;
.title {
padding-left: 8px;
flex: 1;
font-size: 28px;
}
.insets {
width: 116px;
margin-left: 26px;
height: 116px;
img {
width: 100%;
height: 100%;
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillageInjoint",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="1"></projectNav>
<div class="focus_news">
<div class="news_img">
<img src="@/assets/images/sunVillage/8.jpg" />
</div>
<div class="news_title">村一季度财务情况公布</div>
</div>
<div class="news_list">
<ul>
<li class="item_block" @click="skip('/sunVillage/injoint/details')">
<div class="title">一季度收入公开</div>
<div class="insets">
<img src="@/assets/images/sunVillage/2.jpg" />
</div>
</li>
<li class="item_block" @click="skip('/sunVillage/injoint/details')">
<div class="title">二季度收入公开</div>
<div class="insets">
<img src="@/assets/images/sunVillage/2.jpg" />
</div>
</li>
</ul>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.focus_news {
margin: 20px 24px 16px;
.news_img {
width: 702px;
height: 256px;
img {
width: 100%;
height: 100%;
}
}
.news_title {
font-size: 24px;
margin-top: 16px;
}
}
.news_list {
li {
display: flex;
height: 146px;
justify-content: center;
align-items: center;
padding: 0 33px;
.title {
padding-left: 8px;
flex: 1;
font-size: 28px;
}
.insets {
width: 116px;
margin-left: 26px;
height: 116px;
img {
width: 100%;
height: 100%;
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillageInjoint",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>

+ 153
- 153
src/views/sunVillage/dynamic/injoint/publicResources.vue View File

@@ -1,153 +1,153 @@
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="4"></projectNav>
<div class="public_details">
<div class="search_wrap">
<div class="search_ipt">
<input type="text" placeholder="请输入查询信息" class="ipt" />
</div>
<div class="search_btn">查询</div>
</div>
<div class="table_wrap">
<div class="head_main">
<div class="flex f1">资源名称</div>
<div class="flex f2">面积(㎡)</div>
<div class="flex f3">性质</div>
<div class="flex f4">状态</div>
</div>
<div class="tbody_main">
<div
class="item_list"
@click="skip('/sunVillage/injoint/publicResources_desc')"
>
<div class="flex f1">18号大楼1233</div>
<div class="flex f2">19</div>
<div class="flex f3">经营</div>
<div class="flex f4">正常</div>
</div>
<div
class="item_list"
@click="skip('/sunVillage/injoint/publicResources_desc')"
>
<div class="flex f1">18号大楼1233</div>
<div class="flex f2">19</div>
<div class="flex f3">经营</div>
<div class="flex f4">正常</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.public_details {
margin: 20px 24px 0;
.search_wrap {
height: 84px;
display: flex;
border-bottom: 1px solid #e6e6e6;
.search_ipt {
flex: 1;
display: flex;
padding: 0 20px;
.ipt {
flex: 1;
font-size: 34px;
}
}
.search_btn {
width: 110px;
font-size: 34px;
color: #b3b3b3;
display: flex;
justify-content: center;
align-items: center;
border-left: 1px solid #e6e6e6;
}
}
.table_wrap {
.head_main {
height: 76px;
display: flex;
color: #bababa;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
&.f1 {
flex: 6;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 2;
}
}
}
.tbody_main {
.item_list {
height: 150px;
display: flex;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&.f1 {
flex: 6;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 2;
}
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillagePublicResources",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>
<template>
<div class="home_wrapper">
<header-nav
:headings="headingsTitle"
:currentNav="1"
returnUrl="/sunVillage/index"
></header-nav>
<projectNav :serialTag="4"></projectNav>
<div class="public_details">
<div class="search_wrap">
<div class="search_ipt">
<input type="text" placeholder="请输入查询信息" class="ipt" />
</div>
<div class="search_btn">查询</div>
</div>
<div class="table_wrap">
<div class="head_main">
<div class="flex f1">资源名称</div>
<div class="flex f2">面积(㎡)</div>
<div class="flex f3">性质</div>
<div class="flex f4">状态</div>
</div>
<div class="tbody_main">
<div
class="item_list"
@click="skip('/sunVillage/injoint/publicResources_desc')"
>
<div class="flex f1">0001机动地</div>
<div class="flex f2">20</div>
<div class="flex f3">经营</div>
<div class="flex f4">正常</div>
</div>
<div
class="item_list"
@click="skip('/sunVillage/injoint/publicResources_desc')"
>
<div class="flex f1">西部山林地</div>
<div class="flex f2">19.5</div>
<div class="flex f3">经营</div>
<div class="flex f4">正常</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 198px;
min-height: 100vh;
background: #fff;
.public_details {
margin: 20px 24px 0;
.search_wrap {
height: 84px;
display: flex;
border-bottom: 1px solid #e6e6e6;
.search_ipt {
flex: 1;
display: flex;
padding: 0 20px;
.ipt {
flex: 1;
font-size: 34px;
}
}
.search_btn {
width: 110px;
font-size: 34px;
color: #b3b3b3;
display: flex;
justify-content: center;
align-items: center;
border-left: 1px solid #e6e6e6;
}
}
.table_wrap {
.head_main {
height: 76px;
display: flex;
color: #bababa;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
&.f1 {
flex: 6;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 2;
}
}
}
.tbody_main {
.item_list {
height: 150px;
display: flex;
.flex {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&.f1 {
flex: 6;
}
&.f2 {
flex: 2;
}
&.f3 {
flex: 2;
}
&.f4 {
flex: 2;
}
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import projectNav from "@/components/sunVillage/injoint/nav";
export default {
name: "sunVillagePublicResources",
components: { headerNav, projectNav },
data() {
return {
headingsTitle: "三资公开",
};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>

+ 164
- 164
src/views/sunVillage/equity/info.vue View File

@@ -1,164 +1,164 @@
<template>
<div class="home_wrapper">
<header-nav :currentNav="3" returnUrl="/sunVillage/index"></header-nav>
<equityHeader :serialTag="1"></equityHeader>
<div class="equity_main">
<div class="header_mian">
<div class="flex3">
<div class="title">户人数</div>
<div class="cont">4</div>
</div>
<div class="flex4">
<div class="title">宅基地㎡</div>
<div class="cont">4500</div>
</div>
<div class="flex4">
<div class="title">宅基地㎡</div>
<div class="cont">4500</div>
</div>
</div>
<div class="households_main">
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">户主</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘嘘唏</div>
<div class="sex">男</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">妻子</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘淼</div>
<div class="sex">女</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">长子</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘大壮</div>
<div class="sex">男</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 126px;
min-height: 100vh;
background: #fff;
.equity_main {
margin: 0 24px;
padding: 15px 0;
.header_mian {
height: 80px;
display: flex;
margin-bottom: 15px;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.flex3 {
flex: 3;
display: flex;
}
.flex4 {
flex: 4;
display: flex;
}
.title {
font-size: 30px;
padding: 0 15px;
color: #999;
}
.cont {
font-size: 30px;
color: #07c160;
flex: 1;
text-align: center;
}
}
.households_main {
.flex_block {
height: 115px;
position: relative;
margin-bottom: 18px;
margin-left: 60px;
display: flex;
border-bottom: 1px solid #e6e6e6;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.unit {
width: 34px;
display: flex;
position: absolute;
left: -40px;
font-size: 28px;
color: #07c160;
}
.head {
width: 64px;
height: 64px;
margin-left: 10px;
img {
width: 100%;
height: 100%;
}
}
.name {
width: 170px;
text-align: center;
font-size: 30px;
}
.sex {
width: 100px;
font-size: 24px;
text-align: center;
}
.meberCode {
flex: 1;
text-align: center;
.text {
color: #999;
margin-bottom: 8px;
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import equityHeader from "@/components/sunVillage/equity_header";
export default {
name: "sunVillageEquity",
components: { headerNav, equityHeader },
data() {
return {};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>
<template>
<div class="home_wrapper">
<header-nav :currentNav="3" returnUrl="/sunVillage/index"></header-nav>
<equityHeader :serialTag="1"></equityHeader>
<div class="equity_main">
<div class="header_mian">
<div class="flex3">
<div class="title">户人数</div>
<div class="cont">4</div>
</div>
<div class="flex4">
<div class="title">宅基地㎡</div>
<div class="cont">4500</div>
</div>
<div class="flex4">
<div class="title">宅基地㎡</div>
<div class="cont">4500</div>
</div>
</div>
<div class="households_main">
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">户主</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘树人</div>
<div class="sex">男</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">妻子</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘淼</div>
<div class="sex">女</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
<div class="flex_block" @click="skip('/sunVillage/equity_desc')">
<div class="unit">长子</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘大壮</div>
<div class="sex">男</div>
<div class="meberCode">
<div class="text">成员户编码</div>
<div class="code">15456456464646</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 126px;
min-height: 100vh;
background: #fff;
.equity_main {
margin: 0 24px;
padding: 15px 0;
.header_mian {
height: 80px;
display: flex;
margin-bottom: 15px;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.flex3 {
flex: 3;
display: flex;
}
.flex4 {
flex: 4;
display: flex;
}
.title {
font-size: 30px;
padding: 0 15px;
color: #999;
}
.cont {
font-size: 30px;
color: #07c160;
flex: 1;
text-align: center;
}
}
.households_main {
.flex_block {
height: 115px;
position: relative;
margin-bottom: 18px;
margin-left: 60px;
display: flex;
border-bottom: 1px solid #e6e6e6;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.unit {
width: 34px;
display: flex;
position: absolute;
left: -40px;
font-size: 28px;
color: #07c160;
}
.head {
width: 64px;
height: 64px;
margin-left: 10px;
img {
width: 100%;
height: 100%;
}
}
.name {
width: 170px;
text-align: center;
font-size: 30px;
}
.sex {
width: 100px;
font-size: 24px;
text-align: center;
}
.meberCode {
flex: 1;
text-align: center;
.text {
color: #999;
margin-bottom: 8px;
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import equityHeader from "@/components/sunVillage/equity_header";
export default {
name: "sunVillageEquity",
components: { headerNav, equityHeader },
data() {
return {};
},
mounted() {},
methods: {
skip(url) {
this.$router.push(url);
},
},
};
</script>

+ 202
- 202
src/views/sunVillage/equity/shareBonus.vue View File

@@ -1,202 +1,202 @@
<template>
<div class="home_wrapper">
<header-nav :currentNav="3" returnUrl="/sunVillage/index"></header-nav>
<equityHeader :serialTag="2"></equityHeader>
<div class="equity_main">
<div class="date_main" @click="selectDateFun">
<i class="icon"></i>
<div class="year">2022<span class="unit">年</span></div>
</div>
<div class="header_mian">
<div class="flex3">
<div class="title">户人数</div>
<div class="cont">4</div>
</div>
<div class="flex4">
<div class="title">总股数</div>
<div class="cont">4500</div>
</div>
<div class="flex4">
<div class="title">总分红</div>
<div class="cont">4500</div>
</div>
</div>
<div class="households_main">
<div class="flex_block">
<div class="unit">户主</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘嘘唏</div>
<div class="numberShare" @click="skip('/sunVillage/shareBonus_num')">
<div class="text">股数</div>
<div class="code">1000</div>
</div>
<div class="bonus" @click="skip('/sunVillage/shareBonus_amount')">
<div class="text">总分红(元)</div>
<div class="code">3000</div>
</div>
</div>
</div>
</div>
<van-popup v-model:show="dateVisbile" round position="bottom">
<van-picker
title="选择年"
show-toolbar
:columns="yearColumns"
:default-index="yearSelect"
@confirm="yearConfirm"
@cancel="dateVisbile = false"
/>
</van-popup>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 126px;
min-height: 100vh;
background: #fff;
.equity_main {
margin: 0 24px;
padding: 15px 0;
.date_main {
width: 220px;
height: 68px;
border-bottom: 2px solid #ededed;
display: flex;
justify-content: center;
align-items: center;
font-size: 28px;
.icon {
width: 26px;
height: 26px;
background: url("../../../assets/images/sunVillage/select_date_icon.jpg")
no-repeat;
background-size: 100% 100%;
display: block;
margin: 0 25px 0 12px;
}
.year {
.unit {
padding: 0 10px;
}
}
}
.header_mian {
height: 80px;
display: flex;
margin-bottom: 15px;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.flex3 {
flex: 3;
display: flex;
}
.flex4 {
flex: 4;
display: flex;
}
.title {
font-size: 30px;
padding: 0 15px;
color: #999;
}
.cont {
font-size: 30px;
color: #07c160;
flex: 1;
text-align: center;
}
}
.households_main {
.flex_block {
height: 115px;
position: relative;
margin-bottom: 18px;
margin-left: 60px;
display: flex;
border-bottom: 1px solid #e6e6e6;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.unit {
width: 34px;
display: flex;
position: absolute;
left: -40px;
font-size: 28px;
color: #07c160;
}
.head {
width: 64px;
height: 64px;
margin-left: 10px;
img {
width: 100%;
height: 100%;
}
}
.name {
width: 150px;
text-align: center;
font-size: 30px;
}
.bonus,
.numberShare {
flex: 1;
font-size: 28px;
text-align: center;
.text {
color: #999;
margin-bottom: 8px;
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import equityHeader from "@/components/sunVillage/equity_header";
export default {
name: "sunVillageEquity",
components: { headerNav, equityHeader },
data() {
return {
dateVisbile: false,
yearColumns: [2000, 2001, 2002],
yearSelect: null,
};
},
mounted() {
this.yearData();
},
methods: {
skip(url) {
this.$router.push(url);
},
selectDateFun() {
this.dateVisbile = !this.dateVisbile;
},
yearData() {
for (let i = 2000; i < 2060; i++) {
this.yearColumns.push(i);
}
//显示当前年份
var year = new Date().getFullYear();
this.yearSelect = this.yearColumns.indexOf(Number(year));
},
yearConfirm(value) {
// this.formatDate = value + "年";
// this.form.reportDate = value.toString();
// this.yearShow = false;
this.dateVisbile = false;
},
},
};
</script>
<template>
<div class="home_wrapper">
<header-nav :currentNav="3" returnUrl="/sunVillage/index"></header-nav>
<equityHeader :serialTag="2"></equityHeader>
<div class="equity_main">
<div class="date_main" @click="selectDateFun">
<i class="icon"></i>
<div class="year">2022<span class="unit">年</span></div>
</div>
<div class="header_mian">
<div class="flex3">
<div class="title">户人数</div>
<div class="cont">4</div>
</div>
<div class="flex4">
<div class="title">总股数</div>
<div class="cont">4500</div>
</div>
<div class="flex4">
<div class="title">总分红</div>
<div class="cont">4500</div>
</div>
</div>
<div class="households_main">
<div class="flex_block">
<div class="unit">户主</div>
<div class="head">
<img src="../../../assets/images/sunVillage/head_portrait.jpg" />
</div>
<div class="name">刘树人</div>
<div class="numberShare" @click="skip('/sunVillage/shareBonus_num')">
<div class="text">股数</div>
<div class="code">2.00</div>
</div>
<div class="bonus" @click="skip('/sunVillage/shareBonus_amount')">
<div class="text">总分红(元)</div>
<div class="code">850.00</div>
</div>
</div>
</div>
</div>
<van-popup v-model:show="dateVisbile" round position="bottom">
<van-picker
title="选择年"
show-toolbar
:columns="yearColumns"
:default-index="yearSelect"
@confirm="yearConfirm"
@cancel="dateVisbile = false"
/>
</van-popup>
</div>
</template>
<style scoped lang="scss">
.home_wrapper {
width: 100%;
padding-top: 126px;
min-height: 100vh;
background: #fff;
.equity_main {
margin: 0 24px;
padding: 15px 0;
.date_main {
width: 220px;
height: 68px;
border-bottom: 2px solid #ededed;
display: flex;
justify-content: center;
align-items: center;
font-size: 28px;
.icon {
width: 26px;
height: 26px;
background: url("../../../assets/images/sunVillage/select_date_icon.jpg")
no-repeat;
background-size: 100% 100%;
display: block;
margin: 0 25px 0 12px;
}
.year {
.unit {
padding: 0 10px;
}
}
}
.header_mian {
height: 80px;
display: flex;
margin-bottom: 15px;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.flex3 {
flex: 3;
display: flex;
}
.flex4 {
flex: 4;
display: flex;
}
.title {
font-size: 30px;
padding: 0 15px;
color: #999;
}
.cont {
font-size: 30px;
color: #07c160;
flex: 1;
text-align: center;
}
}
.households_main {
.flex_block {
height: 115px;
position: relative;
margin-bottom: 18px;
margin-left: 60px;
display: flex;
border-bottom: 1px solid #e6e6e6;
justify-content: center; /* 相对父元素水平居中 */
align-items: center; /* 子元素相对父元素垂直居中 */
.unit {
width: 34px;
display: flex;
position: absolute;
left: -40px;
font-size: 28px;
color: #07c160;
}
.head {
width: 64px;
height: 64px;
margin-left: 10px;
img {
width: 100%;
height: 100%;
}
}
.name {
width: 150px;
text-align: center;
font-size: 30px;
}
.bonus,
.numberShare {
flex: 1;
font-size: 28px;
text-align: center;
.text {
color: #999;
margin-bottom: 8px;
}
}
}
}
}
}
</style>
<script>
import headerNav from "@/components/sunVillage/common/header.vue";
import equityHeader from "@/components/sunVillage/equity_header";
export default {
name: "sunVillageEquity",
components: { headerNav, equityHeader },
data() {
return {
dateVisbile: false,
yearColumns: [2000, 2001, 2002],
yearSelect: null,
};
},
mounted() {
this.yearData();
},
methods: {
skip(url) {
this.$router.push(url);
},
selectDateFun() {
this.dateVisbile = !this.dateVisbile;
},
yearData() {
for (let i = 2000; i < 2060; i++) {
this.yearColumns.push(i);
}
//显示当前年份
var year = new Date().getFullYear();
this.yearSelect = this.yearColumns.indexOf(Number(year));
},
yearConfirm(value) {
// this.formatDate = value + "年";
// this.form.reportDate = value.toString();
// this.yearShow = false;
this.dateVisbile = false;
},
},
};
</script>

Write Preview
Loading…
Cancel
Save