From 013df78e71b362f0210d284c65f4692e50ca6f16 Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123456 <zxx19900626> Date: 星期二, 12 四月 2022 16:39:48 +0800 Subject: [PATCH] 企业职工社保 --- src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoShouzhiZongbiao.vue | 469 ++++++++++++++++++++--------------- src/pages/components/qiyezhigongShebao/zhigongShebao.vue | 155 +++++++++++ src/router/router.js | 9 src/pages/show/shehuiBaozhang/shehuiBaozhang.vue | 2 src/pages/components/qiyezhigongShebao/zhigongshebaoForm.vue | 76 +++++ src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/qiyezhigongShebao.vue | 36 ++ 6 files changed, 541 insertions(+), 206 deletions(-) diff --git a/src/pages/components/qiyezhigongShebao/zhigongShebao.vue b/src/pages/components/qiyezhigongShebao/zhigongShebao.vue new file mode 100644 index 0000000..ddc80a1 --- /dev/null +++ b/src/pages/components/qiyezhigongShebao/zhigongShebao.vue @@ -0,0 +1,155 @@ +<template> + <div class="zhigongShebao-wrap"> + <el-table + border + :data="tableData" + :header-cell-style="handleheader" + :default-sort = "{prop: 'name', order: 'descending'}" + style="width: 100%"> + <el-table-column + prop="shiqu" + label="鍘匡紙甯傘�佸尯锛�" + align="center" + width="250"> + </el-table-column> + <el-table-column + sortable + prop="name" + label="浼佷笟鑱屽伐鍏昏�佷繚闄╁弬淇濅汉鏁�" + align="center"> + </el-table-column> + <el-table-column + sortable + prop="address" + label="鍦ㄨ亴鑱屽伐" + align="center"> + </el-table-column> + <el-table-column + prop="name" + sortable + label="绂婚��浼�" + align="center"> + </el-table-column> + <el-table-column + label="鎿嶄綔" + width="250" + align="center"> + <template slot-scope="scope"> + <el-button @click="handleClick(scope.row)" type="text" size="small">鏌ョ湅璇︽儏</el-button> + </template> + </el-table-column> + </el-table> + <zhigongshebaoForm ref="zhigongshebaoForm" v-if="zhigongshebaoVisiable"></zhigongshebaoForm> + </div> +</template> + +<script> + import zhigongshebaoForm from "./zhigongshebaoForm"; + export default { + name: "chengzhenXinzengJiuye", + components: { + zhigongshebaoForm + }, + data() { + return { + zhigongshebaoVisiable: false, //寮规 + tableData: [{ + shiqu:'鍏ㄥ競', + date: '1', + name: '1', + address: '1' + }, { + shiqu:'闀垮畨鍖�', + date: '1', + name: '2', + address: '2' + }, { + shiqu:'妗ヨタ鍖�', + date: '3', + name: '3', + address: '4' + }, { + shiqu:'鏂板崕鍖�', + date: '4', + name: '4', + address: '1 ' + }] + } + }, + methods: { + handleClick(row) { + this.zhigongshebaoVisiable = true + this.$nextTick(() => { + this.$refs.zhigongshebaoForm.init() + }) + }, + handleheader(data) { + return { + lineHeight: '2.5', + } + } + } + } +</script> + +<style lang="scss"> + @import "../../../assets/css/base"; + .zhigongShebao-wrap{ + width: 100%; + padding-top: 0.078125rem /* 20/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*/ + } + .el-table .sort-caret{ + border: 0.05rem solid transparent; + } + .el-table .sort-caret.descending{ + bottom: -0.04296875rem /* -11/256 */; + border-top-color: #cef2ff; + } + .el-table .descending .sort-caret.descending{ + border-top-color: #409EFF; + } + .el-table .sort-caret.ascending{ + top: -0.04296875rem /* -11/256 */; + border-bottom-color: #cef2ff; + } + .el-table .ascending .sort-caret.ascending{ + border-bottom-color: #409EFF; + } + + } +</style> +<style scoped> + +</style> diff --git a/src/pages/components/qiyezhigongShebao/zhigongshebaoForm.vue b/src/pages/components/qiyezhigongShebao/zhigongshebaoForm.vue new file mode 100644 index 0000000..dfaae68 --- /dev/null +++ b/src/pages/components/qiyezhigongShebao/zhigongshebaoForm.vue @@ -0,0 +1,76 @@ +<template> + <div class="zhigongshebaoForm"> + <el-dialog + :visible.sync="dialogVisible" + width="86%" + :before-close="handleClose"> + <div class="zhigongshebaoEcharts" ref="zhigongshebaoEcharts"></div> + </el-dialog> + + </div> +</template> + +<script> + export default { + name: "zhigongshebaoForm", + data() { + return { + dialogVisible: false, + } + }, + methods: { + init() { + this.dialogVisible = true + }, + handleClose() { + this.dialogVisible = false + } + } + } +</script> + +<style lang="scss"> + // dialog瀵硅瘽妗� + .zhigongshebaoForm { + .el-dialog__wrapper { + background: rgba(0, 0, 0, 0.9); + } + .el-dialog { + background: url(../../../assets/images/businessPolicy/dialog@2x.png) + no-repeat center; + background-size: 100% 100%; + height: 4.375rem; + } + .el-icon-close:before { + content: url(../../../assets/images/businessPolicy/dialogClose@2x.png); + width: 0.1875rem /* 48/256 */; + height: 0.1875rem; + background-size: 100% 100%; + } + .el-dialog__headerbtn{ + position: absolute; + top: 0.3125rem /* 80/256 */; + right: 0.3125rem /* 80/256 */; + } + .el-dialog__header { + padding: 0; + width: 0; + height: 0; + } + .el-dialog__body { + text-align: center; + color: #eeeeee; + h1 { + margin-top: 0.4375rem; + font-size: 0.1563rem; + } + span { + font-size: 0.1094rem; + } + } + .el-divider { + margin: 0; + background-color: #eeeeee; + } + } +</style> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue index 8c86ff1..627e1a1 100644 --- a/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhang.vue @@ -12,7 +12,7 @@ <h1>绀句繚鏀舵敮鎬昏〃</h1> </div> </el-menu-item> - <el-menu-item> + <el-menu-item index="/qiyezhigongShebao"> <div class="menu-left-block"> <h1>浼佷笟鑱屽伐绀句繚</h1> </div> diff --git a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/qiyezhigongShebao.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/qiyezhigongShebao.vue new file mode 100644 index 0000000..04ae330 --- /dev/null +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/qiyezhigongShebao.vue @@ -0,0 +1,36 @@ +<template> + <div class="qiyezhigongShebao-wrap"> + <div class="danwei-box">鍗曚綅锛氫汉</div> + <zhigongShebao></zhigongShebao> + </div> +</template> + +<script> + import zhigongShebao from "../../../components/qiyezhigongShebao/zhigongShebao"; + export default { + name: "qiyezhigongShebao", + components: { + zhigongShebao + }, + data() { + return { + + } + } + } +</script> + +<style lang="scss" scoped> + @import "../../../../assets/css/base"; + .qiyezhigongShebao-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/shebaoShouzhiZongbiao.vue b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoShouzhiZongbiao.vue index 87aa6e3..97b089f 100644 --- a/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoShouzhiZongbiao.vue +++ b/src/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoShouzhiZongbiao.vue @@ -3,243 +3,280 @@ <div class="shebaoShouzhiZongbiao-table"> <h1>绀句細淇濋殰鍩洪噾缁熻琛�</h1> <el-table - v-fit-columns + :data="tableData" style="width: 100%"> <el-table-column + align="center" prop="name" label="椤圭洰" - :data="tableData" fixed> </el-table-column> - <el-table-column - label="1鏈�"> + <el-table-column label="1鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="zhengjishouru" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="benyuezhichu" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="item.benyuejieyu" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="2鏈�" align="center"> <el-table-column + align="center" prop="totalMoney" label="鎬绘敹鍏�"> </el-table-column> <el-table-column - prop="zhengjishouru" + align="center" + prop="totalMoney" label="寰侀泦鏀跺叆"> </el-table-column> <el-table-column - prop="benyuezhichu" + align="center" + prop="totalMoney" label="鏈湀鏀嚭"> </el-table-column> <el-table-column - prop="benyuejieyu" + align="center" + prop="totalMoney" label="鏈湀缁撲綑"> </el-table-column> </el-table-column> - <el-table-column - label="2鏈�"> + <el-table-column label="3鏈�" align="center"> <el-table-column + align="center" prop="totalMoney" label="鎬绘敹鍏�"> </el-table-column> <el-table-column + align="center" prop="totalMoney" label="寰侀泦鏀跺叆"> </el-table-column> <el-table-column + align="center" prop="totalMoney" label="鏈湀鏀嚭"> </el-table-column> <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="4鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="5鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="6鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="7鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="9鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="10鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="11鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="12鏈�" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀缁撲綑"> + </el-table-column> + </el-table-column> + <el-table-column label="鏈勾绱" align="center"> + <el-table-column + align="center" + prop="totalMoney" + label="鎬绘敹鍏�"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="寰侀泦鏀跺叆"> + </el-table-column> + <el-table-column + align="center" + prop="totalMoney" + label="鏈湀鏀嚭"> + </el-table-column> + <el-table-column + align="center" prop="totalMoney" label="鏈湀缁撲綑"> </el-table-column> </el-table-column> <el-table-column - label="3鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="4鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="5鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="6鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="7鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="9鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="10鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="11鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="12鏈�"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column - label="鏈勾绱"> - <el-table-column - prop="totalMoney" - label="鎬绘敹鍏�"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="寰侀泦鏀跺叆"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀鏀嚭"> - </el-table-column> - <el-table-column - prop="totalMoney" - label="鏈湀缁撲綑"> - </el-table-column> - </el-table-column> - <el-table-column + align="center" prop="name" label="绱缁撲綑"> </el-table-column> @@ -253,13 +290,29 @@ name: "shebaoShouzhiZongbiao", data() { return { - tableData:[{ - totalMoney: '323332', - zhengjishouru: '223333', - benyuezhichu: '3t638', - benyuejieyu: '76373637' - }] + tableHead:[], + tableData:[ + { + name: '椤圭洰1', + mouth: '1鏈�', + totalMoney: '2222', + zhengjishouru: '12333', + benyuezhichu:'52667', + benyuejieyu:'2332' + }, + { + name: '椤圭洰2', + mouth: '1鏈�', + totalMoney: '2222', + zhengjishouru: '12333', + benyuezhichu:'52667', + benyuejieyu:'2332' + } + ] } + }, + mounted() { + } } </script> @@ -270,6 +323,12 @@ width: 100%; height: calc(100% - 0.078125rem /* 20/256 */); margin-top: 0.078125rem /* 20/256 */; + /*.el-table .cell, el-table th > .cell{*/ + /* display: inline-block;*/ + /* white-space: nowrap;*/ + /* width: auto;*/ + /* overflow: auto;*/ + /*}*/ .el-table th.el-table__cell{ background-color:$color-blue; height: 0.3125rem /* 80/256 */; diff --git a/src/router/router.js b/src/router/router.js index 0c3bc1a..0653b3d 100644 --- a/src/router/router.js +++ b/src/router/router.js @@ -90,6 +90,15 @@ import( "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/shebaoShouzhiZongbiao.vue" ) + }, + { + path: "/qiyezhigongShebao", + meta: { title: "浼佷笟鑱屽伐绀句繚" }, + name: "qiyezhigongShebao", + component: () => + import( + "@/pages/show/shehuiBaozhang/shehuiBaozhangChildren/qiyezhigongShebao.vue" + ) } ] }, -- Gitblit v1.9.1