ZZJ
2022-07-27 f358f667a292973618199b51552d61179181cf1d
src/views/operateManage/productManage/ProductList.vue
@@ -17,6 +17,7 @@
          :data="dataList"
          tooltip-effect="dark"
          :fit="true"
          :key="num"
        >
          <el-table-column label="序号" width="68">
            <template slot-scope="scope">{{ scope.$index + 1 }}</template>
@@ -63,6 +64,51 @@
              </span>
            </template>
          </el-table-column>
          <el-table-column
            width="350"
            key="status"
            label="安装包管理"
            align="center"
          >
            <template slot-scope="scope">
              <div class="uploadBox">
                <file-uploader
                  single
                  uploadPlaceholder="上传文件"
                  url="/admin/api-f/file/upload"
                  @complete="onFileUpload($event, scope.row)"
                  @file-added="onFileAdded(scope.row)"
                  v-if="scope.row.status === 0"
                />
                <div class="name" v-if="scope.row.status === 1">
                  {{ scope.row.component_name }}
                </div>
                <div
                  class="cancel"
                  v-if="scope.row.status === 1"
                  @click="cancel(scope.row)"
                >
                  取消
                </div>
                <div
                  class="save"
                  @click="submit(scope.row)"
                  v-if="scope.row.status === 1"
                >
                  保存
                </div>
                <div
                  class="save"
                  @click="editPcg(scope.row)"
                  v-if="scope.row.status === 2"
                >
                  编辑
                </div>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
@@ -77,16 +123,21 @@
<script>
import DelBox from "@/views/operateManage/productManage/DelBox";
import FileUploader from "@/components/subComponents/FileUpload/index";
import { getFilePath } from "@/api/utils";
import {
  getProductListByModel,
  setProductIsShow,
  setProductIndexShow,
  deleteProduct,
  saveProductPackage,
} from "@/api/product";
export default {
  components: {
    DelBox,
    FileUploader,
  },
  created() {
    this.getProductList();
@@ -98,6 +149,8 @@
      dataList: [],
      showDelBox: false,
      delId: null,
      stop: false,
      num: 0,
    };
  },
  methods: {
@@ -107,6 +160,9 @@
      });
      if (res && res.success) {
        this.dataList = res.data.productList;
        this.dataList.forEach((item) => {
          item.status = 2;
        });
      }
    },
    edit() {
@@ -146,6 +202,41 @@
        id: id,
        indexShow: val,
      });
    },
    onFileUpload(params, row) {
      row.component_name = params.filename;
      console.log(row.component_name);
      getFilePath(params).then((res) => {
        if (res.code == 200) {
          this.num++;
          row.component_path = res.data;
          row.status = 1;
        }
      });
    },
    onFileAdded() {},
    cancel(row) {
      this.num++;
      row.status = 0;
    },
    async submit(row) {
      console.log(row);
      const res = await saveProductPackage({
        component_path: row.component_path,
        productId: row.productId,
      });
      if (res && res.success) {
        this.$notify({
          type: "success",
          message: "保存成功",
        });
        row.status = 2;
        this.num++;
      }
    },
    editPcg(row) {
      this.num++;
      row.status = 0;
    },
  },
};
@@ -270,5 +361,23 @@
      cursor: pointer;
    }
  }
  .uploadBox {
    display: flex;
    justify-content: center;
    line-height: 32px;
    .cancel {
      color: #0064ff;
      margin: 0 10px;
      margin-left: 35px;
      cursor: pointer;
    }
    .save {
      color: #0064ff;
      cursor: pointer;
    }
  }
}
</style>