haoxuan
2024-05-07 1cd64a26daed3e0eb7b4ccf74e50267d79eaef09
src/components/makepager/TableCommonView.vue
@@ -13,8 +13,9 @@
      :show-summary="showSummary.show"
      :summary-method="getSummaries"
      :span-method="arraySpanMethod"
      :class="tableList.headerHeight?'table-height-47px':''"
      @selection-change="handleSelectionChange"
      :header-cell-style="{ background: '#f1f3f8', color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }"
      :header-cell-style="{ background: '#f1f3f8', height:tableList.headerHeight?tableList.headerHeight:'37px',color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }"
      size="mini"
      @row-click="tableRowClick"
      :row-class-name="tableRowClassName"
@@ -42,6 +43,7 @@
      
      <template slot="header">
          {{ item.label }}
          <div v-if="item.weekDay">{{item.weekDay}}</div>
          <span v-if="item.iconRight">
            <i
              :class="item.iconRight"
@@ -95,8 +97,17 @@
          <span
            v-else-if="item.isCommonClick && scope.row[item.prop]"
            class="sel-name"
            @click="selCommonClick(scope.row)"
            >{{ scope.row[item.prop] }}</span
            @click="selCommonClick(scope.row,item.prop,item)"
            >
            <div v-if="item.isCallMethod">
              <span :class="item.isClass ? item.getClassName(scope.row[item.prop], scope.row) : ''">
              <span v-if="item.isIcon" v-html="item.getCallMethod(scope.row[item.prop], scope.row)"></span>
              <span v-else>{{ item.getCallMethod(scope.row[item.prop], scope.row) }}</span>
              </span>
            </div>
            <span v-else>{{ scope.row[item.prop] }}</span>
            </span
          >
          <div v-else-if="item.isProductName" class="product-view">
            <ul v-if="scope.row.products && scope.row.products.length > 0">
@@ -143,6 +154,39 @@
            <span :class="item.isClass ? item.getClassName(scope.row[item.prop], scope.row) : ''">{{
              item.getCallMethod(scope.row[item.prop], scope.row)
            }}</span>
          </div>
          <div v-else-if="item.isEditTd">
              <template
                  v-if="scope.row[item.prop+'editType']=='inputFloat'"
                >
                <el-input-number
                  v-model="scope.row[item.prop]"
                  placeholder="请输入"
                  :min="0"
                  :precision="2"
                  :controls="false"
                  size="mini"
                  style="width: calc(100% - 80px); margin-right: 5px"
                  @change="
                    (val) => {
                      commonInputChange(val, item.prop, scope.row, scope)
                    }
                  "
                ></el-input-number>
                <el-button
                  type="text"
                  @click="saveEditShow(item.prop, scope.row, scope)"
                  >保存</el-button
                >
              </template>
              <span v-else>
                  {{ scope.row[item.prop] }}
                <i
                  class="el-icon-edit"
                  style="font-size: 16px; margin-left: 5px; cursor: pointer"
                  @click="handleEditShow(scope.row,scope,item)"
                ></i>
              </span>
          </div>
          <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span>
        </template>
@@ -227,9 +271,39 @@
        this.showcol = newVal
      },
      immediate: true
    }
    },
  },
  methods: {
    // 表格编辑
    handleEditShow(row,scope,item){
      scope.row[item.prop+'editType']=='inputFloat'
      this.$set(this.tableList.tableInfomation[scope.$index],item.prop+'editType','inputFloat')
      this.$forceUpdate()
    },
    commonInputChange(val, prop, row, scope) {
      // if (row.editType=='inputFloat') {
      //   let value = scope.row[prop]
      //   let reg2 = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/
      //   if (!reg2.test(value) || value == 0) {
      //     this.$message.error("需要填写大于0的2位小数!")
      //     return true
      //   }
      //   this.$forceUpdate()
      // }
      this.$emit("inputContent", val, prop, row, scope)
    },
    saveEditShow( prop, row, scope){
      if (row.editType=='inputFloat') {
        let value = scope.row[prop]
        let reg2 = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/
        if (!reg2.test(value) || value == 0) {
          this.$message.error("需要填写大于0的2位小数!")
          return true
        }
        this.$forceUpdate()
      }
      this.$emit("inputContent", prop, row, scope)
    },
    onMaskClick() {
      this.iscolopen = false
    },
@@ -400,8 +474,8 @@
      this.$emit("selServiceOrderClick", row)
    },
    // 公共(销售机会、报价单、销售总单、销售子单。。。)
    selCommonClick(row) {
      this.$emit("selCommonClick", row)
    selCommonClick(row,prop,item) {
      this.$emit("selCommonClick", row,prop,item)
    },
    // 行点击
    tableRowClick(row, column, event) {
@@ -479,6 +553,21 @@
      font-weight: bold;
    }
  }
  .el-table__fixed{
    height:calc(100% - 8px)!important;
  }
  .el-table__fixed-body-wrapper{
    top:37px!important;
  }
  .table-height-47px .el-table__fixed-body-wrapper{
    top:47px!important;
  }
  .el-table__body-wrapper{
    height:calc(100% - 38px)!important;
  }
  .table-height-47px .el-table__body-wrapper{
    height:calc(100% - 48px)!important;
  }
}
::v-deep .el-table .cell {