iTDM-web/itdmWeb/src/views/module-iTDM/itdmYeWu/itdmGcShishi.vue

<template>
  <div>
    <div class="head">第三部分　项目过程实施</div>
    <table class="main-table">
      <tr v-for="(item, index) in tableData.assessmentLog" :key="index">
        <!-- <td :rowspan="12" style="width: 80px">项目成员<br/>考核日志</td> -->
        <td class="title" style="width: 100px">
          <div>{{ tableData.assessmentLog.length }}</div>
          <input v-model="item.name" style="width: 80px;text-align: center" />
        </td>
        <td class="content" colspan="3">
          <table>
            <thead>
              <td style="width: 80px;">序号</td>
              <td style="width: 80px;">日期</td>
              <td style="width: 80px;">工时</td>
              <td style="width: 80px;">强度</td>
              <td style="width: 80px;">工作量</td>
              <td style="width: 80px;">告知数</td>
              <td style="width: 80px;">差错数</td>
              <td style="width: 80px;">催促数</td>
              <td style="width: 80px;">警告数</td>
              <!-- <td style="width: 60px">操作</td> -->
            </thead>
            <tr>
              <td>1</td>
              <td><input style="width: 80px;" v-model="item.resultData.date" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.gongshi" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.qiangdu" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.gongzuoliang" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.gaozhiNum" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.chacuoNum" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.cuicuNum" /></td>
              <td><input style="width: 80px;" v-model="item.resultData.jinggaoNum" /></td>
              <!-- <td><div class="delBtn" @click="delRow(index)" v-show="tableData.cleanPrice.length >= 2">删除</div></td> -->
            </tr>
          </table>
        </td>
        <td class="content" style="width: 100px">量化积分</td>
      </tr>
      <tr>
        <td class="title" style="width: 80px">非考核<br/>支持人员</td>
        <td class="content" style="width: 100px">
        </td>
        <td class="title white" style="width: 80px">项目成员<br/>考核汇总</td>
        <td class="content" style="width: 100px" colspan="2">
        </td>
      </tr>
      <tr>
        <td class="title" style="width: 80px">项目完工<br/>申请</td>
        <td class="content" style="width: 100px">
        </td>
        <td class="title white" style="width: 80px">提交人</td>
        <td class="content" style="width: 100px" colspan="2">
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  name: 'itdmGcShishi',
  data() {
    return {
      tableData: {
        assessmentLog: [
          { name: '', resultData: {} }
        ]
      },
    }
  },
}
</script>

<style scoped>
@import '~@assets/less/common.less';
table * {
  box-sizing: border-box;
  font-size: 14px;
}
table {
  border: 1px solid rgb(30, 53, 65);
  width: 100%;
}
td {
  text-align: center;
  border: 1px solid rgb(30, 53, 65);
}
tr {
  height: 50px;
}

.main-table {
  background-color: #FDEADA;
}
.title {
  background-color: #fff;
}
.addRow {
  width: 60px;
  height: 24px;
  background-color: #fff;
  border-radius: 4px;
  text-align: center;
  line-height: 24px;
  font-size: 12px;
  margin-left: 20px;
  cursor: pointer;
}
.btn {
  display: inline-block;
  padding: 2px 10px;
  font-size: 13px;
  border: 1px solid rgb(3, 188, 244);
  color: rgb(8, 187, 241);
  border-radius: 4px;
  cursor: pointer;
  position: absolute;
  right: 3%;
}
.delBtn {
  padding: 3px 10px;
  text-align: center;
  font-size: 12px;
}
input {
  padding: 0 20px;
  height: 50px;
  outline: none;
  border: none;
  background: transparent;
}

.head {
    height: 35px;
    background-color: #FFFF00;
    text-align: center;
    line-height: 35px;
    font-weight: bold;
    font-size: 18px;
    border: 1px solid rgb(30, 53, 65);
}
</style>