工时管理

lxp

2025-03-14 9c91c96c4c1dca21670abfa7a0c879a734a888de

 src/components/Table/lims-table.vue

@@ -4,8 +4,6 @@
    <el-table
      ref="multipleTable"
      v-loading="tableLoading"
      element-loading-text="加载中..."
      element-loading-spinner="el-icon-loading"
      :border="border"
      :data="tableData"
      :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }"
@@ -45,6 +43,7 @@
        :filter-multiple="item.filterMultiple"
        :filtered-value="item.filteredValue"
        :filters="item.filters"
        :fixed="item.fixed"
        :label="item.label"
        :min-width="item.minWidth"
        :prop="item.prop"
@@ -53,10 +52,8 @@
        "
        :sortable="item.sortable ? true : false"
        :type="item.type"
        :width="
          item.dataType === 'action' ? getWidth(item.operation) : item.width
        "
        align="center"
        :width="item.dataType == 'action' ? btnWidth : item.width"
      >
        <!-- <div class="123" v-if="item.type == ''"> -->
        <template
@@ -133,6 +130,89 @@
              >{{ scope.row[item.prop] | formatters(item.formatData) }}</el-tag
            >
          </div>

          <!-- 按钮 -->
          <div
            v-else-if="item.dataType == 'action'"
            :style="`width:${getWidth(item.operation, scope.row)}`"
          >
            <template v-for="(o, key) in item.operation">
              <el-button
                v-show="o.type != 'upload'"
                size="mini"
                v-if="o.showHide ? o.showHide(scope.row) : true"
                :disabled="o.disabled ? o.disabled(scope.row) : false"
                :icon="iconFn(o)"
                :plain="o.plain"
                :style="{ color: o.name === '删除' ? '#f56c6c' : o.color }"
                :type="o.type | typeFn(scope.row)"
                @click="o.clickFun(scope.row)"
                :key="key"
              >
                {{ o.name }}
              </el-button>
              <el-upload
                :action="javaApi + o.url"
                size="mini"
                ref="upload"
                :multiple="o.multiple ? o.multiple : false"
                :disabled="o.disabled ? o.disabled(scope.row) : false"
                :accept="
                  o.accept
                    ? o.accept
                    : '.jpg,.jpeg,.png,.gif,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip,.rar'
                "
                v-if="o.type == 'upload' && o.url"
                style="display: inline-block; width: 50px"
                :data="o.data ? o.data(scope.row) : {}"
                :before-upload="
                  o.beforeUpload ? o.beforeUpload(scope.row) : () => true
                "
                v-show="o.showHide ? o.showHide(scope.row) : true"
                :headers="uploadHeader"
                :on-error="onError"
                :on-exceed="onExceed"
                :on-success="handleSuccessUp"
                :show-file-list="false"
                :key="key"
              >
                <el-button
                  :size="o.size ? o.size : 'small'"
                  type="text"
                  :disabled="o.disabled ? o.disabled(scope.row) : false"
                  >{{ o.name }}</el-button
                >
              </el-upload>
              <el-upload
                action="#"
                :on-change="
                  (file, fileList) => o.clickFun(scope.row, file, fileList)
                "
                :multiple="o.multiple ? o.multiple : false"
                :limit="o.limit ? o.limit : 1"
                :disabled="o.disabled ? o.disabled(scope.row) : false"
                :accept="
                  o.accept
                    ? o.accept
                    : '.jpg,.jpeg,.png,.gif,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip,.rar'
                "
                v-if="o.type == 'upload' && !o.url"
                style="display: inline-block; width: 50px"
                v-show="o.showHide ? o.showHide(scope.row) : true"
                :auto-upload="false"
                :on-exceed="onExceed"
                :show-file-list="false"
                :key="key"
              >
                <el-button
                  :size="o.size ? o.size : 'small'"
                  type="text"
                  :disabled="o.disabled ? o.disabled(scope.row) : false"
                  >{{ o.name }}</el-button
                >
              </el-upload>
            </template>
          </div>
          <!-- 可点击的文字 -->
          <div
            v-else-if="item.dataType == 'link'"
@@ -151,107 +231,6 @@
              scope.row[item.prop] | formatters(item.formatData)
            }}</span>
          </div>
        </template>
      </el-table-column>
      <!-- 操作列 -->
      <el-table-column
        v-if="table.operator"
        :label="(table.operatorConfig && table.operatorConfig.label) || '操作'"
        :width="
          table.operatorConfig &&
          (table.operatorConfig.width
            ? table.operatorConfig.width
            : calcOperationWidth())
        "
        :min-width="
          (table.operatorConfig && table.operatorConfig.width) ||
          table.operatorConfig.minWidth ||
          100
        "
        align="center"
        :fixed="table.operatorConfig ? table.operatorConfig.fixed : 'right'"
        :show-overflow-tooltip="true"
      >
        <template slot-scope="scope">
          <template v-for="(o, index) in table.operator">
            <el-button
              :key="index"
              v-if="o.type != 'upload'"
              @click.stop="o.clickFun(scope.row)"
              :type="o.type || 'text'"
              :icon="o.icon"
              :size="o.size || 'small'"
              :disabled="o.disabled ? o.disabled(scope.row) : false"
              v-show="o.showFun ? o.showFun(scope.row) : true"
              :class="[
                'commonButton',
                {
                  del: o.name === '删除' || o.name === '作废',
                },
              ]"
              >{{ o.name }}
            </el-button>
            <el-upload
              :action="javaApi + o.url"
              size="mini"
              ref="upload"
              :multiple="o.multiple ? o.multiple : false"
              :disabled="o.disabled ? o.disabled(scope.row) : false"
              :accept="
                o.accept
                  ? o.accept
                  : '.jpg,.jpeg,.png,.gif,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip,.rar'
              "
              v-if="o.type == 'upload' && o.url"
              style="display: inline-block; width: 50px"
              v-show="o.showHide ? o.showHide(scope.row) : true"
              :data="o.data ? o.data(scope.row) : {}"
              :before-upload="
                o.beforeUpload ? o.beforeUpload(scope.row) : () => true
              "
              :headers="uploadHeader"
              :on-error="onError"
              :on-exceed="onExceed"
              :on-success="handleSuccessUp"
              :show-file-list="false"
              :key="index"
            >
              <el-button
                :size="o.size ? o.size : 'small'"
                type="text"
                :disabled="o.disabled ? o.disabled(scope.row) : false"
                >{{ o.name }}</el-button
              >
            </el-upload>
            <el-upload
              action="#"
              :on-change="
                (file, fileList) => o.clickFun(scope.row, file, fileList)
              "
              :multiple="o.multiple ? o.multiple : false"
              :limit="o.limit ? o.limit : 1"
              :disabled="o.disabled ? o.disabled(scope.row) : false"
              :accept="
                o.accept
                  ? o.accept
                  : '.jpg,.jpeg,.png,.gif,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip,.rar'
              "
              v-if="o.type == 'upload' && !o.url"
              style="display: inline-block; width: 50px"
              v-show="o.showHide ? o.showHide(scope.row) : true"
              :auto-upload="false"
              :on-exceed="onExceed"
              :show-file-list="false"
              :key="index"
            >
              <el-button
                :size="o.size ? o.size : 'small'"
                type="text"
                :disabled="o.disabled ? o.disabled(scope.row) : false"
                >{{ o.name }}</el-button
              >
            </el-upload>
          </template>
        </template>
      </el-table-column>
    </el-table>
@@ -340,7 +319,7 @@
  props: {
    isSelection: {
      type: Boolean,
      default: false,
      default: undefined,
    },
    height: {
      type: String,
@@ -386,18 +365,11 @@
        return {};
      },
    },
    // column: {
    //   type: Array,
    //   default() {
    //     return [];
    //   },
    // },
    table: {
      type: Object,
    column: {
      type: Array,
      default() {
        return {};
        return [];
      },
      required: true,
    },
    rowClassName: {
      type: Function,
@@ -415,7 +387,7 @@
    },
    rowKey: {
      type: String,
      default: undefined,
      default: "id",
    },
    page: {
      type: Object,
@@ -432,41 +404,28 @@
  data() {
    return {
      spanList: [],
      column: [],
      btnWidth: "120px",
    };
  },
  watch: {
    table(val) {
      this.doLayout();
    },
    // column(val) {
    //   this.doLayout();
    // },
  },
  mounted() {
    this.calculateSpanInfo();
    this.column = this.table.column;
  },
  methods: {
    //计算操作列的宽度
    calcOperationWidth() {
      let width = 0;
      this.table.operator.forEach((item) => {
        width += item.name.length * 15 + 15;
      });
      return width;
    },
    doLayout() {
      this.$nextTick(() => {
        this.$refs.multipleTable && this.$refs.multipleTable.doLayout();
      });
    },
    getWidth(row) {
    getWidth(row, row0) {
      let count = 0;
      row.forEach((a) => {
        if (a.showHide !== undefined && a.showHide()) {
        if (a.showHide !== undefined && a.showHide(row0)) {
          count += a.name.length;
        } else if (!a.showHide) {
          count += a.name.length;
        }
      });
      this.btnWidth = count * 15 + 70 + "px";
      return count * 15 + 70 + "px";
    },
    iconFn(row) {