优化工时管理和费用统计前端table的间距

gaoluyang

2024-07-18 856d40165af92868ebf15ab68e73f57f27f81bd8

 src/components/tool/value-table.vue

@@ -115,12 +115,12 @@
        :summary-method="getSummaries" :row-class-name="tableRowClassName" :row-key="record=>record.id"
        :current-row-key="data.currentId" :highlight-current-row="data.highlight===undefined||data.highlight"
        :span-method="spanMethod" :key="specialKey">
        <el-table-column type="selection" width="65" v-if="data.showSelect" :key="Math.random()">
        <el-table-column type="selection" :width="selectionWidth" v-if="data.showSelect" :key="Math.random()">
        </el-table-column>
        <el-table-column type="index" align="center" label="序号" width="65" v-if="data.isIndex" :key="Math.random()">
        <el-table-column type="index" align="center" label="序号" :width="selectionWidth" v-if="data.isIndex" :key="Math.random()">
        </el-table-column>
        <el-table-column :prop="a.label" :label="a.value" :sortable="data.sort==false?false:'custom'"
          v-for="(a, ai) in tableHead" :key="ai" show-overflow-tooltip min-width="155" v-if="!data.headNoShow||(data.headNoShow&&data.headNoShow.length==0)||(data.headNoShow&&data.headNoShow.length>0&&!data.headNoShow.find(d=>d==a.label))">
        <el-table-column :prop="a.label" :label="a.value" :sortable="data.sort==false?false:'custom'" :isColumnWidth="isColumnWidth" :width="a.width"
          v-for="(a, ai) in tableHead" :key="ai" show-overflow-tooltip :min-width="columnMinWidth" v-if="!data.headNoShow||(data.headNoShow&&data.headNoShow.length==0)||(data.headNoShow&&data.headNoShow.length>0&&!data.headNoShow.find(d=>d==a.label))">
          <template slot-scope="scope">
            <div v-if="showType(a.label, data.tagField) != null">
              <template v-if="typeof(scope.row[a.label]) == 'object'">
@@ -335,6 +335,18 @@
  } from 'jquery';
  export default {
    props: {
      selectionWidth: {
        type: String,
        default: () => '65'
      },
      columnMinWidth: {
        type: String,
        default: () => '155'
      },
      isColumnWidth: {
        type: Boolean,
        default: () => false
      },
      tableRowClassName: {
        type: Function
      },
@@ -599,6 +611,24 @@
          this.total = res.data.body.total
          this.tableHead = res.data.head
          this.tableData = res.data.body.records
          if (this.isColumnWidth) {
            this.tableHead.forEach(item => {
              if (item.value.length === 4) {
                item.width = 120
              } else if (item.value.length === 3){
                item.width = 100
              } else if (item.value.length === 5){
                item.width = 130
              } else if (item.value.length === 7){
                item.width = 160
              } else if (item.value.length === 6){
                item.width = 150
              } else {
                item.width = 86
              }
            })
            console.log('this.tableHead----', this.tableHead)
          }
          // console.log(JSON.stringify(this.tableHead)+"---------"+JSON.stringify(this.tableData))
          for (var a in this.data.selectField) {
            if (this.data.selectField[a].choose == true) {