vue3.2/Vite/Ts69: SPU模块删除业务

└─src
    ├─api
    │  └─product
    │      └─spu
    │          └─index.ts
    └─views
        └─product
            └─spu
                └─index.vue

//...
enum API {
  REMOVESPU_URL = "/admin/product/deleteSpu/",
}

//...
export const reqRemoveSpu = (spuId: number | string) =>
  request.delete<any, any>(API.REMOVESPU_URL + spuId);

<template>
  <div>
    <!-- ... -->
    <el-card>
      <div v-show="scene === 0">
        <!-- .... -->
        <el-table border :data="records">
          <!-- ... -->
          <el-table-column label="SPU操作">
            <template #="{row}">
              <!-- ... -->
              <el-popconfirm
                :title="`你确定删除${row.spuName}?`"
                width="200px"
                @confirm="deleteSpu(row)"
              >
                <template #reference>
                  <el-button
                    type="primary"
                    size="small"
                    icon="Delete"
                    title="删除SPU"
                  ></el-button>
                </template>
              </el-popconfirm>
            </template>
          </el-table-column>
        </el-table>
        <!-- ... -->
      </div>
      <!-- ... -->
    </el-card>
  </div>
</template>
<script setup lang="ts">
  //...
  import { onBeforeUnmount } from "vue";
  import { reqRemoveSpu } from "@/api/product/spu";
  //...
  import useCategoryStore from "@/store/modules/category";
  let categoryStore = useCategoryStore();
  //...
  const deleteSpu = async (row: any) => {
    const result: any = await reqRemoveSpu(row.id as number);
    if (result.code === 200) {
      ElMessage({
        type: "success",
        message: "删除成功",
      });
      // 获取剩余SPU列表
      getHasSpu(records.value.length > 1 ? pageNo.value : pageNo.value - 1);
    } else {
      ElMessage({
        type: "success",
        message: "删除失败",
      });
    }
  };
  // 清空仓库数据
  onBeforeUnmount(() => {
    categoryStore.$reset();
  });
</script>