boss/pages/main/index/work_bill.vue

<template>
  <div>
    <el-card class="box-card">
      <div slot="header" class="header clearfix">
        <span>工资账单明细</span>
      </div>
      <el-row :gutter="20">
        <el-col :span="12">
          <div class="module-title">企业方 需求方大汪（12313）</div>
          <div class="module-content">
            <div>实际费用：￥1070.00</div>
            <div>开发款项：￥1000.00</div>
            <div>平台服务费：￥70.00</div>
            <div>应缴税费：￥0</div>
            <div>直通车抵扣：￥0</div>
            <div>托管金额：￥2140.00</div>
            <div>差价：￥1070.00（含税￥70.00）</div>
            <div>退款：￥0（含税￥70.00）</div>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="module-title">开发者 开发者大汪（4534）</div>
          <div class="module-content">
            <div>实际费用：￥1000.00</div>
            <div>开发款项：￥1000.00</div>
            <div>平台服务费：￥0</div>
            <div>应交税费：￥0</div>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="24">
          <div class="module-title">工资明细</div>
          <div class="module-content">
            <div>工作日薪：￥300/天</div>
            <div>工作周期：2019/09/24 至 2019/09/25（10小时）</div>
            <div>正式工资：￥1000.00（10小时）</div>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="24">
          <div class="module-title">账单信息</div>
          <div class="module-content">
            <div>创建时间：2019/09/24  15:04:20</div>
            <div>托管时间：2019/09/24  15:05:20</div>
            <div>结薪时间：2019/09/24  15:05:20</div>
            <div>关联订单：雇佣款_1231  雇佣补差价_1231</div>
            <div>费率明细：企业方：实际服务费率7.00%；</div>
          </div>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
export default {
  
}
</script>

<style lang="scss" scoped>
.box-card {
  margin-bottom: 10px;
  width: 100%;
}

.header {
  font-size: 24px;
  color: #222222;
  font-weight: 600;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.el-col {
  padding-top: 20px;
  padding-bottom: 20px;
}

.module-title {
  font-weight: bold;
}

.module-content {
  margin-top: 17px;
  margin-left: 14px;
}
</style>