细节样式

zhangxiaoxu123456

2022-04-27 b55d1c67769dcc8d90eed2bb4f8a7dfd51e7303a

 src/pages/components/shebaoZhengjiShouru/shebaoZhengjiShouruForm.vue

@@ -3,34 +3,30 @@
    <div class="danwei-box">单位：人</div>
    <div class="shebaoZhengjiShouruForm-table">
      <el-table
        :cell-style="handleCellStyle"
        :max-height="tableHeight"
        border
        style="width: 100%"
        :data="tableData">
        <el-table-column
          width="200"
          align="center"
          prop="area"
          label="县（市、区）">
        </el-table-column>
        <el-table-column
          align="center"
          prop="enterprise"
          label="企业养老保险基金征缴收入">
          prop="inJobs"
          :label="label">
        </el-table-column>
        <el-table-column
          align="center"
          prop="resident"
          label="城乡居民养老保险基金征缴收入">
          prop="income"
          label="征缴收入（万元）">
        </el-table-column>
        <el-table-column
          align="center"
          prop="injuryInsurance"
          label="工伤保险基金征缴收入">
        </el-table-column>
        <el-table-column
          align="center"
          prop="careerInsurance"
          label="失业保险基金征缴收入">
          prop="average"
          label="人均（元）">
        </el-table-column>
      </el-table>
    </div>
@@ -38,6 +34,7 @@
</template>

<script>
  import nowSize from "../../../libs/nowSize";
    export default {
        name: "shebaoZhengjiShouruForm",
        props: {
@@ -46,12 +43,32 @@
                default: () => {
                    return []
                }
            },
            label: {
                type: String,
                default: '在职职工（人）'
            }
        },
        data() {
            return {
                tableData: []
                tableHeight: window.innerHeight - nowSize(380)
            }
        },
        methods: {
            getHeight() {
                this.tableHeight = window.innerHeight - nowSize(350)
            },
            handleCellStyle({rowIndex, columnIndex}) {
                if(columnIndex == 0) {
                    return { background:'#51D2FF' }
                }
            },
        },
        created() {
            window.addEventListener('resize', this.getHeight)
        },
        destroyed() {
            window.addEventListener('resize', this.getHeight)
        }
    }
</script>