feat: 产品列表添加查看编辑按钮;弹窗根据情况展示对应标题

songshankun

2023-10-19 fbe9459ed908eef6c25c3bcd244d0a7e74dfa792

 src/views/productManage/product/index.vue

@@ -29,7 +29,7 @@
      </div>
      <!-- 图表形式 -->
      <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="product-box" v-for="item in tableList.tableInfomation" :key="item.id" @click="showDetail(item)">
          <div class="left">
            <!-- <el-image style="width: 60px; height: 80px" :src="url"></el-image> -->
            <div class="img-view">
@@ -58,12 +58,20 @@
          ref="tableListRef"
          :table-list="tableList"
          @selTableCol="selTableCol"
          @tableRowClick="tableRowClick"
        >
          <template slot="tableButton">
            <el-table-column label="操作" width="90" align="center">
              <template slot-scope="scope">
                <span @click.stop="showDetail(scope.row)" class="cursor_pointer" style="margin-right: 10px">
                  <span style="color: #2a78fb">查看</span>
                </span>
                <span @click.stop="editRow(scope.row)" class="cursor_pointer">
                  <span style="color: #2a78fb">编辑</span>
                </span>
              </template>
            </el-table-column>
          </template>
        </TableCommonView>
        <!-- <div class="btn-pager">
          <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
        </div> -->
      </div>
      <div class="btn-pager">
        <PagerView class="page" :pager-options="pagerOptions" :page-size="pageSizes" v-on="pagerEvents" />
@@ -99,7 +107,8 @@
      editConfig: {
        visible: false,
        title: "新建",
        infomation: {}
        infomation: {},
        autoEdit: false
      },
      isIconIndex: "2", // 1 图标 2 列表
      url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
@@ -254,13 +263,21 @@
      this.editConfig.title = "新建"
      this.editConfig.infomation = {}
    },
    // 行点击
    tableRowClick(row) {
    // 详情
    showDetail(row) {
      console.log(row)
      this.editConfig.visible = true
      this.editConfig.autoEdit = false
      this.editConfig.title = "编辑"
      this.editConfig.infomation = { ...row }
    },
    // 编辑
    editRow(row){
      this.editConfig.autoEdit = true
      this.editConfig.title = "编辑"
      this.editConfig.infomation = { ...row }
      this.editConfig.visible = true
    },
    // 切换列表展现形式
    selIconSwitchClick(value) {
      this.pagerOptions.currPage = 1