style: 客户管理模块样式调整; 分页组件样式调整

songshankun

2023-09-25 c2dde74cf1067543999993b397475a5f6f32852e

 src/components/makepager/TableCommonView.vue

@@ -5,13 +5,15 @@
      border
      :data="tableList.tableInfomation"
      tooltip-effect="dark"
      :height="'calc(100% - 0px)'"
      style="width: 100%"
      :lazy="tableList.lazy"
      :show-summary="showSummary.show"
      :summary-method="getSummaries"
      :span-method="arraySpanMethod"
      @selection-change="handleSelectionChange"
      :header-cell-style="{ background: '#ECF4FF', color: '#666' }"
      :header-cell-style="{ background: '#f1f3f8', color: '#000009' , 'font-size': '12px','font-family':'PingFangSC'}"
      size="mini"
    >
      <el-table-column v-if="selectBox" type="selection" width="40"> </el-table-column>
      <el-table-column
@@ -87,6 +89,26 @@
              <li v-for="(item, index) in scope.row.products" :key="index">
                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
                  {{ item.amount }}
                </div>
              </li>
            </ul>
            <div v-else class="no-product">{{ "--" }}</div>
          </div>
          <div v-else-if="item.isProductPrice" class="product-view">
            <ul v-if="scope.row.products && scope.row.products.length > 0">
              <li v-for="(item, index) in scope.row.products" :key="index">
                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
                  {{ item.price }}
                </div>
              </li>
            </ul>
            <div v-else class="no-product">{{ "--" }}</div>
          </div>
          <div v-else-if="item.isProductTotal" class="product-view">
            <ul v-if="scope.row.products && scope.row.products.length > 0">
              <li v-for="(item, index) in scope.row.products" :key="index">
                <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'">
                  {{ item.total }}
                </div>
              </li>
            </ul>
@@ -184,6 +206,37 @@
              }
            }, 0)
            sums[index + 1]
            if (column.property === "taxUnitPrice") {
              let sumPrice = 0
              this.tableList.tableInfomation.map((item) => {
                item.products.map((val) => {
                  console.log(val.price)
                  sumPrice += parseFloat(val.price)
                })
              })
              console.log((sums[index + 1] = sumPrice))
              console.log(sumPrice)
            }
            if (column.property === "priceTax") {
              let sumPrice = 0
              this.tableList.tableInfomation.map((item) => {
                item.products.map((val) => {
                  console.log(val.price)
                  sumPrice += parseFloat(val.total)
                })
              })
              sums[index + 1] = sumPrice
            }
            if (column.property === "productAmount") {
              let sumPrice = 0
              this.tableList.tableInfomation.map((item) => {
                item.products.map((val) => {
                  console.log(val.price)
                  sumPrice += parseFloat(val.amount)
                })
              })
              sums[index + 1] = sumPrice
            }
          }
        })
        // console.log(sums)
@@ -274,9 +327,8 @@
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.table-view {
  // margin-top: 20px;
  margin-right: 10px;
  // margin-bottom: 40px;
  position: relative;
  height: 100%;
  .blue {
    width: 70px;
    text-align: center;
@@ -300,7 +352,7 @@
        border-bottom: 1px solid #ebeef5;
      }
      .no-bottom {
        border-bottom: 0px;
        border-bottom: 0;
      }
    }
    .no-product {
@@ -310,9 +362,40 @@
  }
}
::v-deep {
  .el-table__footer-wrapper tbody td.el-table__cell {
    background-color: #fff;
    text-align: right;
  .el-table__footer-wrapper {
    tbody td.el-table__cell {
      background-color: #fff;
      font-weight: bold;
    }
  }
}

::v-deep .el-table .cell {
  font-size: 12px;
  line-height: 17px;
  font-family: PingFangSC;
  color: rgba(0, 0, 0, 0.9);
  .el-button--text {
    width: auto;
    height: auto;
    font-family: PingFangSC-Medium, sans-serif;
  }
}
::v-deep .el-table .el-table__cell {
  padding: 6px 0 !important;
  height: 35px;
  text-align: center;
}

::v-deep{
  .el-table .cell .el-button--text.el-button--small{
    padding: 4px 0;
  }
}

::v-deep .el-table .el-table__cell {
  padding: 6px 0 !important;
  height: 35px;
  text-align: center;
}
</style>