From b0e391f5488aead9e56dc725b69cd81ba36f917d Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123456 <zxx19900626> Date: 星期三, 13 四月 2022 10:14:48 +0800 Subject: [PATCH] 社保卡征集收入及社保卡持卡人数页面 --- src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoChikaRenshu.vue | 97 ++++++++++ src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/gongshangBaoxian.vue | 36 ++++ src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/juminYanglaoBaoxian.vue | 36 ++++ src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shiyeBaoxian.vue | 36 ++++ src/router/router.js | 45 +++++ src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoZhengjiShouru.vue | 94 ++++++++++ src/pages/show/shehuiBaozhang/shehuiBaozhang.vue | 10 src/pages/components/juminYanglaoBaoxian/baoxianForm.vue | 146 ++++++++++++++++ 8 files changed, 495 insertions(+), 5 deletions(-) diff --git a/src/pages/components/juminYanglaoBaoxian/baoxianForm.vue b/src/pages/components/juminYanglaoBaoxian/baoxianForm.vue new file mode 100644 index 0000000..6f43268 --- /dev/null +++ b/src/pages/components/juminYanglaoBaoxian/baoxianForm.vue @@ -0,0 +1,146 @@ +<template> + <div class="baoxianForm-wrap"> + <el-table + border + style="width: 100%" + :data="tableData"> + <el-table-column + width="200" + align="center" + prop="name" + label="鍘匡紙甯傘�佸尯锛�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="1鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="1鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="2鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="3鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="4鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="5鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="6鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="7鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="8鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="9鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="10鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="11鏈�"> + </el-table-column> + <el-table-column + align="center" + prop="month" + label="12鏈�"> + </el-table-column> + </el-table> + </div> +</template> + +<script> + export default { + name: "baoxianForm", + data() { + return { + tableData:[{ + name: '鍏ㄥ競', + month: '23233' + },{ + name: '甯傛湰绾�', + month: '23233' + },{ + name: '闀垮畨鍖�', + month: '23233' + }] + } + } + } +</script> + +<style lang="scss"> + @import "../../../assets/css/base"; + .baoxianForm-wrap{ + width: 100%; + height: calc(100% - 0.234375rem /* 60/256 */); + padding-top: 0.234375rem /* 60/256 */; + .el-table th.el-table__cell{ + background-color:$color-blue; + } + .el-table .el-table__body-wrapper tr{ + height: 0.265625rem /* 68/256 */; + } + .el-table tr:nth-child(odd){ + background-color: #CEF2FF; + } + .el-table tr:nth-child(even){ + background-color: #A8E9FF; + } + .el-table, .el-table__expanded-cell{ + background-color: transparent; + } + .el-table thead{ + color: $color-darkGrey; + } + .el-table{ + color: $color-darkGrey; + } + .el-table .cell{ + font-size: $fontSize-28; + color: $color-darkGrey; + font-weight: 300; + line-height: 1; + } + .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{ + border-bottom:1Px solid $color-grey; /*no*/ + } + .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{ + border-right:1Px solid $color-grey; /*no*/ + } + } +</style> + +<style lang="scss" scoped> + +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue index a95fbd1..3e8f513 100644 --- a/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue @@ -22,27 +22,27 @@ <h1>鏈哄叧鑱屽伐绀句繚</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/juminYanglaoBaoxian"> <div class="menu-left-block"> <h1>灞呮皯鍏昏�佷繚闄�</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/shiyeBaoxian"> <div class="menu-left-block"> <h1>澶变笟淇濋櫓</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/gongshangBaoxian"> <div class="menu-left-block"> <h1>宸ヤ激淇濋櫓</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/shebaoZhengjiShouru"> <div class="menu-left-block"> <h1>绀句繚寰佺即鏀跺叆</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/shebaoChikaRenshu"> <div class="menu-left-block"> <h1>绀句繚鍗℃寔鍗′汉鏁�</h1> </div> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/gongshangBaoxian.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/gongshangBaoxian.vue new file mode 100644 index 0000000..a41d305 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/gongshangBaoxian.vue @@ -0,0 +1,36 @@ +<template> + <div class="juminYanglaoBaoxian-wrap"> + <div class="danwei-box">鍗曚綅锛氫汉</div> + <baoxianForm></baoxianForm> + </div> +</template> + +<script> + import baoxianForm from "../../../components/juminYanglaoBaoxian/baoxianForm"; + export default { + name: "juminYanglaoBaoxian", + components: { + baoxianForm + }, + data() { + return { + + } + } + } +</script> + +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .juminYanglaoBaoxian-wrap{ + width: 100%; + height: 100%; + position: relative; + .danwei-box{ + position: absolute; + right: 0; + top: 0; + color: $color-white; + } + } +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/juminYanglaoBaoxian.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/juminYanglaoBaoxian.vue new file mode 100644 index 0000000..6a852a7 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/juminYanglaoBaoxian.vue @@ -0,0 +1,36 @@ +<template> + <div class="juminYanglaoBaoxian-wrap"> + <div class="danwei-box">鍗曚綅锛氫汉</div> + <baoxianForm></baoxianForm> + </div> +</template> + +<script> + import baoxianForm from "../../../components/juminYanglaoBaoxian/baoxianForm"; + export default { + name: "juminYanglaoBaoxian", + components: { + baoxianForm + }, + data() { + return { + + } + } + } +</script> + +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .juminYanglaoBaoxian-wrap{ + width: 100%; + height: 100%; + position: relative; + .danwei-box{ + position: absolute; + right: 0; + top: 0; + color: $color-white; + } + } +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoChikaRenshu.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoChikaRenshu.vue new file mode 100644 index 0000000..cf20b24 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoChikaRenshu.vue @@ -0,0 +1,97 @@ +<template> + <div class="shebaoChikaRenshu-wrap"> + <h1>鍚勫幙锛堝競銆佸尯锛�2021骞村氨涓氭儏鍐电粺璁¤〃</h1> + <el-tabs v-model="activeName"> + <el-tab-pane label="鎬昏" name="first"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="浼佷笟鑱屽伐鍏昏�佷繚闄�" name="second"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="鍩庝埂灞呮皯鍏昏�佷繚闄�" name="third"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="宸ヤ激淇濋櫓" name="fourth"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="澶变笟淇濋櫓" name="five "> + <baoxianForm></baoxianForm> + </el-tab-pane> + </el-tabs> + </div> +</template> + +<script> + import baoxianForm from "../../../components/juminYanglaoBaoxian/baoxianForm"; + export default { + name: "shebaoChikaRenshu", + components: { + baoxianForm, //鍩庨晣鏂板灏变笟 + }, + data() { + return { + activeName: 'first' + } + } + } +</script> + +<style lang="scss"> + @import "../../../../assets/css/base"; + .shebaoChikaRenshu-wrap{ + .el-tabs__nav-wrap::after{ + background-color: transparent; + height: 0; + } + .el-tabs__nav-scroll{ + display: flex; + justify-content: center; + } + .el-tabs__item{ + width: 0.9375rem /* 240/256 */; + height: 0.25rem /* 64/256 */; + background: rgba(81,210,255,0.08); + border: 1Px solid #0097cc; /*no*/ + color: #9CE6FF; + font-size: $fontSize-24; + margin: 0 0.078125rem /* 20/256 */ /* 10/10 */; + display: flex; + justify-content: center; + align-items: center; + } + .el-tabs__item.is-active{ + width: 0.9375rem /* 240/256 */; + height: 0.25rem /* 64/256 */; + background: #00a6e1; + border: 1Px solid #51d2ff; + box-shadow: 0Px 3Px 10Px 0Px rgba(255,255,255,0.80) inset; + color: $color-white; + font-size: $fontSize-24; + display: flex; + justify-content: center; + align-items: center; + } + .el-tabs__nav{ + width: 100%; + display: flex; + justify-content: center; + } + .el-tabs__active-bar{ + height: 0; + } + } +</style> +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .shebaoChikaRenshu-wrap{ + width: 100%; + height: 100%; + h1{ + font-size: $fontSize-30; + color: $color-white; + text-align: center; + line-height: 2; + margin-bottom: 0.078125rem /* 20/256 */; + } + } +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoZhengjiShouru.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoZhengjiShouru.vue new file mode 100644 index 0000000..6b53974 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoZhengjiShouru.vue @@ -0,0 +1,94 @@ +<template> + <div class="shebaoZhengjiShouru-wrap"> + <h1>鍚勫幙锛堝競銆佸尯锛�2021骞村氨涓氭儏鍐电粺璁¤〃</h1> + <el-tabs v-model="activeName"> + <el-tab-pane label="鍩庨晣鏂板灏变笟" name="first"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="澶变笟鍐嶅氨涓�" name="second"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="灏变笟鍥伴毦浜哄憳鍐嶅氨涓�" name="third"> + <baoxianForm></baoxianForm> + </el-tab-pane> + <el-tab-pane label="鐧昏澶变笟鐜�" name="fourth"> + <baoxianForm></baoxianForm> + </el-tab-pane> + </el-tabs> + </div> +</template> + +<script> + import baoxianForm from "../../../components/juminYanglaoBaoxian/baoxianForm"; + export default { + name: "jiuyeQingkuang", + components: { + baoxianForm, + }, + data() { + return { + activeName: 'first' + } + } + } +</script> + +<style lang="scss"> + @import "../../../../assets/css/base"; + .shebaoZhengjiShouru-wrap{ + .el-tabs__nav-wrap::after{ + background-color: transparent; + height: 0; + } + .el-tabs__nav-scroll{ + display: flex; + justify-content: center; + } + .el-tabs__item{ + width: 0.9375rem /* 240/256 */; + height: 0.25rem /* 64/256 */; + background: rgba(81,210,255,0.08); + border: 1Px solid #0097cc; /*no*/ + color: #9CE6FF; + font-size: $fontSize-24; + margin: 0 0.078125rem /* 20/256 */ /* 10/10 */; + display: flex; + justify-content: center; + align-items: center; + } + .el-tabs__item.is-active{ + width: 0.9375rem /* 240/256 */; + height: 0.25rem /* 64/256 */; + background: #00a6e1; + border: 1Px solid #51d2ff; + box-shadow: 0Px 3Px 10Px 0Px rgba(255,255,255,0.80) inset; + color: $color-white; + font-size: $fontSize-24; + display: flex; + justify-content: center; + align-items: center; + } + .el-tabs__nav{ + width: 100%; + display: flex; + justify-content: center; + } + .el-tabs__active-bar{ + height: 0; + } + } +</style> +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .shebaoZhengjiShouru-wrap{ + width: 100%; + height: 100%; + h1{ + font-size: $fontSize-30; + color: $color-white; + text-align: center; + line-height: 2; + margin-bottom: 0.078125rem /* 20/256 */; + } + } +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shiyeBaoxian.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shiyeBaoxian.vue new file mode 100644 index 0000000..e244009 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shiyeBaoxian.vue @@ -0,0 +1,36 @@ +<template> + <div class="shiyeBaoxian-wrap"> + <div class="danwei-box">鍗曚綅锛氫汉</div> + <baoxianForm></baoxianForm> + </div> +</template> + +<script> + import baoxianForm from "../../../components/juminYanglaoBaoxian/baoxianForm"; + export default { + name: "juminYanglaoBaoxian", + components: { + baoxianForm + }, + data() { + return { + + } + } + } +</script> + +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .shiyeBaoxian-wrap{ + width: 100%; + height: 100%; + position: relative; + .danwei-box{ + position: absolute; + right: 0; + top: 0; + color: $color-white; + } + } +</style> diff --git a/src/router/router.js b/src/router/router.js index e90ec5f..07396db 100644 --- a/src/router/router.js +++ b/src/router/router.js @@ -109,6 +109,51 @@ component: () => import( "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/jiguanzhigongShebao.vue" + ) + }, + { + path: "/juminYanglaoBaoxian", + meta: { title: "灞呮皯鍏昏�佷繚闄�" }, + name: "juminYanglaoBaoxian", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/juminYanglaoBaoxian.vue" + ) + }, + { + path: "/shiyeBaoxian", + meta: { title: "澶变笟淇濋櫓" }, + name: "shiyeBaoxian", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shiyeBaoxian.vue" + ) + }, + { + path: "/gongshangBaoxian", + meta: { title: "宸ヤ激淇濋櫓" }, + name: "gongshangBaoxian", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/gongshangBaoxian.vue" + ) + }, + { + path: "/shebaoZhengjiShouru", + meta: { title: "绀句繚寰侀泦鏀跺叆鏄庣粏" }, + name: "shebaoZhengjiShouru", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoZhengjiShouru.vue" + ) + }, + { + path: "/shebaoChikaRenshu", + meta: { title: "绀句繚鍗℃寔鍗′汉鏁�" }, + name: "shebaoChikaRenshu", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoChikaRenshu.vue" ) } ] -- Gitblit v1.9.1