Merge remote-tracking branch 'origin/zzq'

zzq

2023-09-26 25b727a5dc28f3c2d225c5e017da58f35c6b84b3

 src/views/productManage/product/index.vue

@@ -31,11 +31,16 @@
      <div v-if="isIconIndex === '1'" class="product-view">
        <div class="product-box" v-for="item in tableList.tableInfomation" :key="item.id" @click="tableRowClick(item)">
          <div class="left">
            <el-image style="width: 60px; height: 80px" :src="url"></el-image>
            <!-- <el-image style="width: 60px; height: 80px" :src="url"></el-image> -->
            <el-image class="img-view">
              <div slot="error" class="image-slot">
                <i class="el-icon-picture-outline"></i>
              </div>
            </el-image>
          </div>
          <div class="right">
            <div class="label">
              <span>{{ item.name }}</span>
              {{ item.name }}
            </div>
            <div class="price">
              <span>价格:￥</span>
@@ -63,7 +68,7 @@
        </div> -->
      </div>
      <div class="btn-pager">
        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
        <PagerView class="page" :pager-options="pagerOptions" :page-size="pageSizes" v-on="pagerEvents" />
      </div>
    </div>
    <!-- 新建/编辑 -->
@@ -99,15 +104,27 @@
        infomation: {}
      },
      isIconIndex: "1", // 1 图标 2 列表
      url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
      url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
      pageSizes: [15, 30],
      keyWord: "",
      categoryId:null,
    }
  },
  created() {
    this.setTable()
    let query = this.$route.query;
    if (query) {
      this.categoryId = query.id ? Number(query.id) : null;
      this.pagerOptions.currPage=1
    }
    this.getData()
  },
  methods: {
    setTable() {
      if (this.isIconIndex === "1") {
        this.pageSizes = [30, 60]
        this.pagerOptions.pageSize = 30
      }
      this.tableList = {
        tableInfomation: [],
        selectBox: true,
@@ -176,7 +193,7 @@
        },
        {
          label: "产品类型",
          prop: "productType",
          prop: "model",
          isShowColumn: showcol.includes("产品类型"),
          default: false
        },
@@ -207,9 +224,10 @@
      this.tableList.tableColumn = this.setTableColumn(val)
    },
    // 请求数据
    async getData(val) {
    async getData() {
      await getProductList({
        keyWord: val,
        keyWord: this.keyWord,
        categoryId:this.categoryId?this.categoryId:null,
        page: this.pagerOptions.currPage,
        pageSize: this.pagerOptions.pageSize
      }).then((res) => {
@@ -227,13 +245,15 @@
    // 搜索
    searchClick(val) {
      console.log(val)
      this.keyWord = val
      this.pagerOptions.currPage = 1
      this.getData(val)
      this.getData()
    },
    // 新建
    addBtnClick() {
      this.editConfig.visible = true
      this.editConfig.title = "新建"
      this.editConfig.infomation = {}
    },
    // 行点击
    tableRowClick(row) {
@@ -244,7 +264,16 @@
    },
    // 切换列表展现形式
    selIconSwitchClick(value) {
      this.pagerOptions.currPage = 1
      this.isIconIndex = value
      if (value === "1") {
        this.pageSizes = [30, 60]
        this.pagerOptions.pageSize = 30
      } else {
        this.pageSizes = [15, 30]
        this.pagerOptions.pageSize = 15
      }
      this.getData()
    }
  }
}
@@ -288,8 +317,8 @@
  justify-content: flex-start;
  align-content: flex-start;
  .product-box {
    width: 295px;
    height: 84px;
    width: 294px;
    height: 94px;
    margin-bottom: 10px;
    margin-right: 20px;
    border: 1px solid #dee2e6;
@@ -298,24 +327,41 @@
    -webkit-box-shadow: inset 0 0 2px #dee2e6;
    padding: 8px;
    display: flex;
    align-items: center;
    cursor: pointer;
    .left {
      width: 60px;
      text-align: center;
      .img-view {
        width: 60px;
        height: 80px;
        line-height: 80px;
        border: 1px solid #dee2e6;
        font-size: 22px;
        color: #b8babb;
      }
    }
    .right {
      flex: 1;
      font-size: 13px;
      margin-left: 10px;
      .label {
        // max-height: 30px;
        color: #212529;
        // margin-top: -5px;
        margin-right: 15px;
        word-break: break-all;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .price,
      .library {
        color: #495057;
        margin-top: 3px;
        margin-top: 10px;
      }
    }
  }