loulijun2021
2022-10-29 e713b378b01d189f972cfb5b9eae749ee95a8b51
src/views/scgl/cngh.vue
@@ -188,7 +188,9 @@
    >
      <el-button v-if="operation==='setting'" type="primary" @click="addRow">新增</el-button>
      <div class="elTableDiv">
        <!--        选择默认方案的时候是这个table-->
        <el-table
          v-if="operation!=='setting'"
          ref="tableDataDialogRef"
          class="tableFixedDialog"
          :data="tableDataDialog"
@@ -200,8 +202,8 @@
          :header-cell-style="this.$headerCellStyle"
          :cell-style="this.$cellStyle"
        >
          <el-table-column
            v-if="operation!=='setting'"
            width="50"
            fixed
          >
@@ -218,7 +220,6 @@
            prop="code"
            label="方案编码"
            width="100"
            fixed
            show-tooltip-when-overflow
          >
            <template slot-scope="{row}">
@@ -365,6 +366,195 @@
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                @focus="val=>getTime(val,row,'wktme5_start')"
              />
            </template>
          </el-table-column>
          <el-table-column
            v-if="operation==='setting'"
            width="100"
            fixed="right"
            label="操作"
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <el-button v-if="row.isVisible===0" type="text" @click="delRow(row)">删除</el-button>
                <el-button v-if="row.isVisible===1" type="text" @click="saveRow(row)">保存</el-button>
                <el-button v-if="row.isVisible===1" type="text" @click="cancelRow(row)">取消</el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <!--      设置的时候是这个table-->
        <el-table
          v-else
          ref="tableDataDialogRef"
          class="tableFixedDialog"
          :data="tableDataDialog"
          :style="{width: 100+'%',height:(tableHeight-200)+'px'}"
          border
          :height="(tableHeight-200)+'px'"
          :row-class-name="tableRowClassName"
          highlight-current-row
          :header-cell-style="this.$headerCellStyle"
          :cell-style="this.$cellStyle"
        >
          <el-table-column
            prop="code"
            label="方案编码"
            width="100"
            fixed
            show-tooltip-when-overflow
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">{{ row.code }}</div>
              <el-input v-else v-model="row.code" placeholder="请输入" type="text" />
            </template>
          </el-table-column>
          <el-table-column
            prop="name"
            label="方案名称"
            width="150"
            fixed
            show-tooltip-when-overflow
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">{{ row.name }}</div>
              <el-input v-else v-model="row.name" placeholder="请输入" type="text" />
            </template>
          </el-table-column>
          <el-table-column
            prop="duration"
            label="工作时长"
            width="100"
            show-tooltip-when-overflow
          >
            <template slot-scope="{row}">
              <div>{{ row.duration ? parseFloat(row.duration.toFixed(2)) : '0' }} 小时</div>
            </template>
          </el-table-column>
          <el-table-column
            prop="wktme1_start"
            label="工作时间一"
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">
                <div v-if="row.wktme1_start">{{ row.wktme1_start }}</div>
                <div v-else>/</div>
              </div>
              <el-time-picker
                v-else
                v-model="row.wktme1_start"
                is-range
                :editable="false"
                :clearable="false"
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                format="HH:mm"
                @blur="val=>getTime(val,row,'wktme1_start')"
                @focus="val=>getTime(val,row,'wktme1_start')"
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="wktme2_start"
            label="工作时间二"
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">
                <div v-if="row.wktme2_start">{{ row.wktme2_start }}</div>
                <div v-else>/</div>
              </div>
              <el-time-picker
                v-else-if="row.isVisible===1"
                v-model="row.wktme2_start"
                is-range
                :disabled="row.wktme1_start.length===0"
                :editable="false"
                :clearable="false"
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                format="HH:mm"
                @blur="val=>getTime(val,row,'wktme2_start')"
                @focus="val=>getTime(val,row,'wktme2_start')"
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="wktme3_start"
            label="工作时间三"
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">
                <div v-if="row.wktme3_start">{{ row.wktme3_start }}</div>
                <div v-else>/</div>
              </div>
              <el-time-picker
                v-else-if="row.isVisible===1"
                v-model="row.wktme3_start"
                is-range
                :disabled="row.wktme2_start.length===0"
                :editable="false"
                :clearable="false"
                format="HH:mm"
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                @blur="val=>getTime(val,row,'wktme3_start')"
                @focus="val=>getTime(val,row,'wktme3_start')"
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="wktme4_start"
            label="工作时间四"
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">
                <div v-if="row.wktme4_start">{{ row.wktme4_start }}</div>
                <div v-else>/</div>
              </div>
              <el-time-picker
                v-else-if="row.isVisible===1"
                v-model="row.wktme4_start"
                is-range
                :disabled="row.wktme3_start.length===0"
                format="HH:mm"
                :clearable="false"
                :editable="false"
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                @blur="val=>getTime(val,row,'wktme4_start')"
                @focus="val=>getTime(val,row,'wktme4_start')"
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="wktme5_start"
            label="工作时间五"
          >
            <template slot-scope="{row}">
              <div v-if="row.isVisible===0">
                <div v-if="row.wktme5_start">{{ row.wktme5_start }}</div>
                <div v-else>/</div>
              </div>
              <el-time-picker
                v-else-if="row.isVisible===1"
                v-model="row.wktme5_start"
                is-range
                :disabled="row.wktme4_start.length===0"
                :clearable="false"
                :editable="false"
                format="HH:mm"
                range-separator="~"
                start-placeholder="开始"
                end-placeholder="结束"
                @blur="val=>getTime(val,row,'wktme5_start')"
                @focus="val=>getTime(val,row,'wktme5_start')"
              />
            </template>
@@ -873,17 +1063,22 @@
  }
}
</style>
<style>
<style lang="scss">
.el-table .custom-row {
  background: #f8f8fa;
}
/*为了让面板在超出区域可显示*/
.el-table__body-wrapper{
  overflow: visible !important
}
.table_only{
overflow: visible !important
  overflow: visible !important;
  .el-table__body-wrapper{
    overflow: visible !important
  }
}
/*为了让面板在超出区域可显示*/
/*.el-table__body-wrapper{*/
/*  overflow: visible !important*/
/*}*/
/*.table_only{*/
/*overflow: visible !important*/
/*}*/
</style>