feat: 添加4口机柜图片并更新相关逻辑
- 新增4口机柜图片文件 - 在cabinetImgMap.ts中添加4口机柜的映射 - 更新useTag.ts中的路由匹配逻辑,增加对query.id的判断 - 在smart-cabinet-card/index.vue和ab98/index.vue中添加多标签页支持 - 修改goods-edit-modal.vue中的删除逻辑,并调整弹窗为抽屉样式 - 在smart-cabinet-card/detail.vue中添加格口管理功能,支持配置商品、库存和下架操作
This commit is contained in:
parent
0716346cdb
commit
b195336876
Binary file not shown.
After Width: | Height: | Size: 36 KiB |
|
@ -455,7 +455,10 @@ function tagOnClick(item) {
|
||||||
router.push({ name });
|
router.push({ name });
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
router.push({ path });
|
router.push({
|
||||||
|
path,
|
||||||
|
query: item.query
|
||||||
|
});
|
||||||
}
|
}
|
||||||
// showMenuModel(item?.path, item?.query);
|
// showMenuModel(item?.path, item?.query);
|
||||||
}
|
}
|
||||||
|
@ -516,43 +519,25 @@ onBeforeUnmount(() => {
|
||||||
</span>
|
</span>
|
||||||
<div ref="scrollbarDom" class="scroll-container">
|
<div ref="scrollbarDom" class="scroll-container">
|
||||||
<div class="tab select-none" ref="tabDom" :style="getTabStyle">
|
<div class="tab select-none" ref="tabDom" :style="getTabStyle">
|
||||||
<div
|
<div :ref="'dynamic' + index" v-for="(item, index) in multiTags" :key="index" :class="[
|
||||||
:ref="'dynamic' + index"
|
|
||||||
v-for="(item, index) in multiTags"
|
|
||||||
:key="index"
|
|
||||||
:class="[
|
|
||||||
'scroll-item is-closable',
|
'scroll-item is-closable',
|
||||||
linkIsActive(item),
|
linkIsActive(item),
|
||||||
route.path === item.path && showModel === 'card'
|
route.path === item.path && showModel === 'card'
|
||||||
? 'card-active'
|
? 'card-active'
|
||||||
: ''
|
: ''
|
||||||
]"
|
]" @contextmenu.prevent="openMenu(item, $event)" @mouseenter.prevent="onMouseenter(index)"
|
||||||
@contextmenu.prevent="openMenu(item, $event)"
|
@mouseleave.prevent="onMouseleave(index)" @click="tagOnClick(item)">
|
||||||
@mouseenter.prevent="onMouseenter(index)"
|
<router-link :to="item.path" class="dark:!text-text_color_primary dark:hover:!text-primary">
|
||||||
@mouseleave.prevent="onMouseleave(index)"
|
|
||||||
@click="tagOnClick(item)"
|
|
||||||
>
|
|
||||||
<router-link
|
|
||||||
:to="item.path"
|
|
||||||
class="dark:!text-text_color_primary dark:hover:!text-primary"
|
|
||||||
>
|
|
||||||
{{ item.meta.title }}
|
{{ item.meta.title }}
|
||||||
</router-link>
|
</router-link>
|
||||||
<span
|
<span v-if="
|
||||||
v-if="
|
|
||||||
iconIsActive(item, index) ||
|
iconIsActive(item, index) ||
|
||||||
(index === activeIndex && index !== 0)
|
(index === activeIndex && index !== 0)
|
||||||
"
|
" class="el-icon-close" @click.stop="deleteMenu(item)">
|
||||||
class="el-icon-close"
|
|
||||||
@click.stop="deleteMenu(item)"
|
|
||||||
>
|
|
||||||
<IconifyIconOffline :icon="CloseBold" />
|
<IconifyIconOffline :icon="CloseBold" />
|
||||||
</span>
|
</span>
|
||||||
<!-- <div
|
<div :ref="'schedule' + index" v-if="showModel !== 'card'" style="display: none;"
|
||||||
:ref="'schedule' + index"
|
:class="[scheduleIsActive(item)]" />
|
||||||
v-if="showModel !== 'card'"
|
|
||||||
:class="[scheduleIsActive(item)]"
|
|
||||||
/> -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -561,17 +546,8 @@ onBeforeUnmount(() => {
|
||||||
</span>
|
</span>
|
||||||
<!-- 右键菜单按钮 -->
|
<!-- 右键菜单按钮 -->
|
||||||
<transition name="el-zoom-in-top">
|
<transition name="el-zoom-in-top">
|
||||||
<ul
|
<ul v-show="visible" :key="Math.random()" :style="getContextMenuStyle" class="contextmenu">
|
||||||
v-show="visible"
|
<div v-for="(item, key) in tagsViews.slice(0, 6)" :key="key" style="display: flex; align-items: center">
|
||||||
:key="Math.random()"
|
|
||||||
:style="getContextMenuStyle"
|
|
||||||
class="contextmenu"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
v-for="(item, key) in tagsViews.slice(0, 6)"
|
|
||||||
:key="key"
|
|
||||||
style="display: flex; align-items: center"
|
|
||||||
>
|
|
||||||
<li v-if="item.show" @click="selectTag(key, item)">
|
<li v-if="item.show" @click="selectTag(key, item)">
|
||||||
<IconifyIconOffline :icon="item.icon" />
|
<IconifyIconOffline :icon="item.icon" />
|
||||||
{{ item.text }}
|
{{ item.text }}
|
||||||
|
@ -580,23 +556,14 @@ onBeforeUnmount(() => {
|
||||||
</ul>
|
</ul>
|
||||||
</transition>
|
</transition>
|
||||||
<!-- 右侧功能按钮 -->
|
<!-- 右侧功能按钮 -->
|
||||||
<el-dropdown
|
<el-dropdown trigger="click" placement="bottom-end" @command="handleCommand">
|
||||||
trigger="click"
|
|
||||||
placement="bottom-end"
|
|
||||||
@command="handleCommand"
|
|
||||||
>
|
|
||||||
<span class="arrow-down">
|
<span class="arrow-down">
|
||||||
<IconifyIconOffline :icon="ArrowDown" class="dark:text-white" />
|
<IconifyIconOffline :icon="ArrowDown" class="dark:text-white" />
|
||||||
</span>
|
</span>
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu>
|
<el-dropdown-menu>
|
||||||
<el-dropdown-item
|
<el-dropdown-item v-for="(item, key) in tagsViews" :key="key" :command="{ key, item }" :divided="item.divided"
|
||||||
v-for="(item, key) in tagsViews"
|
:disabled="item.disabled">
|
||||||
:key="key"
|
|
||||||
:command="{ key, item }"
|
|
||||||
:divided="item.divided"
|
|
||||||
:disabled="item.disabled"
|
|
||||||
>
|
|
||||||
<IconifyIconOffline :icon="item.icon" />
|
<IconifyIconOffline :icon="item.icon" />
|
||||||
{{ item.text }}
|
{{ item.text }}
|
||||||
</el-dropdown-item>
|
</el-dropdown-item>
|
||||||
|
|
|
@ -128,7 +128,11 @@ export function useTags() {
|
||||||
return isEqual(route.params, item.params) ? previous : next;
|
return isEqual(route.params, item.params) ? previous : next;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
return route.path === item.path ? previous : next;
|
const route_id = String(route.query?.id);
|
||||||
|
const item_id = String(item.query?.id);
|
||||||
|
return route.path === item.path &&
|
||||||
|
route_id == item_id
|
||||||
|
? previous : next;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -31,4 +31,8 @@ export const CabinetImgMap = {
|
||||||
img: "cabinet_120.jpg",
|
img: "cabinet_120.jpg",
|
||||||
name: "120口机柜",
|
name: "120口机柜",
|
||||||
},
|
},
|
||||||
|
9: {
|
||||||
|
img: "cabinet_4.jpg",
|
||||||
|
name: "4口机柜",
|
||||||
|
},
|
||||||
}
|
}
|
|
@ -1,18 +1,28 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { useRoute } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
import { getSmartCabinetDetailApi, type SmartCabinetDTO } from "@/api/cabinet/smart-cabinet";
|
import { getSmartCabinetDetailApi, type SmartCabinetDTO } from "@/api/cabinet/smart-cabinet";
|
||||||
|
import { changeGoodsCellsStock, clearGoodsCells, getCabinetCellList, type CabinetCellDTO } from "@/api/cabinet/cabinet-cell";
|
||||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||||
import { CabinetImgMap } from "@/utils/cabinetImgMap";
|
import { CabinetImgMap } from "@/utils/cabinetImgMap";
|
||||||
import GatewayConfigModal from "@/views/cabinet/smart-cabinet/GatewayConfigModal.vue";
|
import GatewayConfigModal from "@/views/cabinet/smart-cabinet/GatewayConfigModal.vue";
|
||||||
import ShopConfigModal from "@/views/cabinet/smart-cabinet/ShopConfigModal.vue";
|
import ShopConfigModal from "@/views/cabinet/smart-cabinet/ShopConfigModal.vue";
|
||||||
import MainCabinetConfigModal from "@/views/cabinet/smart-cabinet/MainCabinetConfigModal.vue";
|
import MainCabinetConfigModal from "@/views/cabinet/smart-cabinet/MainCabinetConfigModal.vue";
|
||||||
|
import CabinetGoodsConfigModal from "@/views/shop/cabinet-goods/cabinet-goods-config-modal.vue";
|
||||||
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
|
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
|
||||||
|
import EditPen from "@iconify-icons/ep/edit-pen";
|
||||||
|
import Delete from "@iconify-icons/ep/delete";
|
||||||
|
import AddFill from "@iconify-icons/ri/add-circle-line";
|
||||||
|
import Search from "@iconify-icons/ep/search";
|
||||||
|
import Refresh from "@iconify-icons/ep/refresh";
|
||||||
|
import { getGoodsInfo } from "@/api/shop/goods";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "SmartCabinetDetail"
|
name: "SmartCabinetDetail"
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const cabinetInfo = ref<SmartCabinetDTO>({
|
const cabinetInfo = ref<SmartCabinetDTO>({
|
||||||
cabinetName: "",
|
cabinetName: "",
|
||||||
|
@ -27,6 +37,69 @@ const cabinetId = ref<number>(0);
|
||||||
const gatewayConfigVisible = ref(false);
|
const gatewayConfigVisible = ref(false);
|
||||||
const shopConfigVisible = ref(false);
|
const shopConfigVisible = ref(false);
|
||||||
const mainCabinetConfigVisible = ref(false);
|
const mainCabinetConfigVisible = ref(false);
|
||||||
|
const cellList = ref<CabinetCellDTO[]>([]);
|
||||||
|
const cellPagination = ref({
|
||||||
|
pageSize: 5,
|
||||||
|
currentPage: 1,
|
||||||
|
total: 0
|
||||||
|
});
|
||||||
|
const goodsConfigVisible = ref(false);
|
||||||
|
const currentCellId = ref<number>();
|
||||||
|
|
||||||
|
function handleConfigure(row: CabinetCellDTO) {
|
||||||
|
currentCellId.value = row.cellId;
|
||||||
|
goodsConfigVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleStockConfig(row: CabinetCellDTO) {
|
||||||
|
try {
|
||||||
|
const { data } = await getGoodsInfo(row.goodsId!);
|
||||||
|
const remainingStock = data.stock - data.totalStock + row.stock;
|
||||||
|
|
||||||
|
const { value } = await ElMessageBox.prompt(
|
||||||
|
`请输入${row.goodsName || '未配置商品'}的库存数量(本次最多可分配:${remainingStock})。\n 若可分配数量不足,请先调整商品列表中的库存。`,
|
||||||
|
'配置库存',
|
||||||
|
{
|
||||||
|
inputPattern: /^0$|^[1-9]\d*$/,
|
||||||
|
inputValue: row.stock?.toString(),
|
||||||
|
inputErrorMessage: '请输入有效的非负整数',
|
||||||
|
inputValidator: (inputValue: string) => {
|
||||||
|
const num = Number(inputValue);
|
||||||
|
if (num > remainingStock) {
|
||||||
|
return '分配数量不能超过剩余库存';
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
if (Number(value) > remainingStock) {
|
||||||
|
ElMessage.warning('分配数量不能超过剩余库存');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await changeGoodsCellsStock(row.cellId!, Number(value));
|
||||||
|
ElMessage.success('库存更新成功');
|
||||||
|
fetchCellList();
|
||||||
|
} catch (error) {
|
||||||
|
console.error('库存配置取消或失败', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleClearGoods(row: CabinetCellDTO) {
|
||||||
|
try {
|
||||||
|
await ElMessageBox.confirm(
|
||||||
|
`确认要下架${row.goodsName || '未配置商品'}吗?`,
|
||||||
|
'警告',
|
||||||
|
{ confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }
|
||||||
|
);
|
||||||
|
await clearGoodsCells(row.cellId!);
|
||||||
|
ElMessage.success('商品下架成功');
|
||||||
|
fetchCellList();
|
||||||
|
} catch (error) {
|
||||||
|
console.error('操作取消或失败', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
async function fetchCabinetDetail() {
|
async function fetchCabinetDetail() {
|
||||||
try {
|
try {
|
||||||
|
@ -38,9 +111,45 @@ async function fetchCabinetDetail() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function switchCellType(cellType: number) {
|
||||||
|
switch (cellType) {
|
||||||
|
case 1: return '小格';
|
||||||
|
case 2: return '中格';
|
||||||
|
case 3: return '大格';
|
||||||
|
case 4: return '超大格';
|
||||||
|
default: return '未知';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fetchCellList() {
|
||||||
|
try {
|
||||||
|
loading.value = true;
|
||||||
|
const { data } = await getCabinetCellList({
|
||||||
|
cabinetId: cabinetId.value,
|
||||||
|
pageSize: cellPagination.value.pageSize,
|
||||||
|
pageNum: cellPagination.value.currentPage
|
||||||
|
});
|
||||||
|
cellList.value = data.rows;
|
||||||
|
cellPagination.value.total = data.total;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleCellSizeChange(val: number) {
|
||||||
|
cellPagination.value.pageSize = val;
|
||||||
|
fetchCellList();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleCellPageChange(val: number) {
|
||||||
|
cellPagination.value.currentPage = val;
|
||||||
|
fetchCellList();
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
cabinetId.value = Number(route.query.id);
|
cabinetId.value = Number(route.query.id);
|
||||||
fetchCabinetDetail();
|
fetchCabinetDetail();
|
||||||
|
fetchCellList();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -90,7 +199,7 @@ onMounted(() => {
|
||||||
<div class="tab-header">
|
<div class="tab-header">
|
||||||
<el-tabs type="card" v-model="activeTab">
|
<el-tabs type="card" v-model="activeTab">
|
||||||
<el-tab-pane label="基本信息" name="basic"></el-tab-pane>
|
<el-tab-pane label="基本信息" name="basic"></el-tab-pane>
|
||||||
<el-tab-pane label="单元格配置" name="cells"></el-tab-pane>
|
<el-tab-pane label="格口管理" name="cells"></el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -101,15 +210,69 @@ onMounted(() => {
|
||||||
<el-descriptions-item label="操作员">{{ cabinetInfo.operator || '-' }}</el-descriptions-item>
|
<el-descriptions-item label="操作员">{{ cabinetInfo.operator || '-' }}</el-descriptions-item>
|
||||||
</el-descriptions>
|
</el-descriptions>
|
||||||
|
|
||||||
<div class="info-details" v-if="activeTab === 'cells'">
|
<div class="cell-details" v-if="activeTab === 'cells'">
|
||||||
<!-- 单元格配置内容 -->
|
<el-table v-loading="loading" :data="cellList" border>
|
||||||
|
<el-table-column label="格口ID" prop="cellId" width="80" />
|
||||||
|
<el-table-column label="格口号" prop="cellNo" width="80" />
|
||||||
|
<el-table-column label="商品图片" width="120">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-image :src="row.coverImg" :preview-src-list="[row.coverImg]" fit="cover" class="rounded" width="60"
|
||||||
|
height="60" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="商品名称">
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ row.goodsId ? row.goodsName : '未配置商品' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="价格" prop="price" width="80" />
|
||||||
|
<el-table-column label="库存" prop="stock" width="80" />
|
||||||
|
<el-table-column label="单元格类型" prop="cellType" width="120">
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ switchCellType(row.cellType) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="购买次数" prop="orderCount" width="100" />
|
||||||
|
<el-table-column label="相关信息" width="150" fixed="right">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-button type="success" link :icon="useRenderIcon('document')"
|
||||||
|
@click="router.push({ path: '/shop/order/index', query: { cellId: row.cellId } })">
|
||||||
|
购买记录
|
||||||
|
</el-button>
|
||||||
|
<el-button type="warning" link :icon="useRenderIcon('document')"
|
||||||
|
@click="router.push({ path: '/cabinet/operation/index', query: { cellId: row.cellId } })">
|
||||||
|
开启记录
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" width="150" fixed="right">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-button type="success" link :icon="useRenderIcon(AddFill)" @click="handleConfigure(row)">
|
||||||
|
配置商品
|
||||||
|
</el-button>
|
||||||
|
<el-button v-if="row.goodsId" type="warning" link :icon="useRenderIcon(EditPen)"
|
||||||
|
@click="handleStockConfig(row)">
|
||||||
|
配置库存
|
||||||
|
</el-button>
|
||||||
|
<el-button v-if="row.goodsId" type="danger" link :icon="useRenderIcon(Delete)"
|
||||||
|
@click="handleClearGoods(row)">
|
||||||
|
下架商品
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-pagination v-model:current-page="cellPagination.currentPage" v-model:page-size="cellPagination.pageSize"
|
||||||
|
:page-sizes="[5, 8, 16, 24, 32]" layout="total, sizes, prev, pager, next, jumper" :total="cellPagination.total"
|
||||||
|
@size-change="handleCellSizeChange" @current-change="handleCellPageChange" class="pagination" />
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
<GatewayConfigModal v-model="gatewayConfigVisible" :cabinet-id="cabinetId"
|
<GatewayConfigModal v-model="gatewayConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
|
||||||
@refresh="fetchCabinetDetail" />
|
|
||||||
<ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
|
<ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
|
||||||
<MainCabinetConfigModal v-model="mainCabinetConfigVisible" :cabinet-id="cabinetId"
|
<MainCabinetConfigModal v-model="mainCabinetConfigVisible" :cabinet-id="cabinetId"
|
||||||
@refresh="fetchCabinetDetail" />
|
@refresh="fetchCabinetDetail" />
|
||||||
|
<el-drawer v-model="goodsConfigVisible" title="配置商品" size="50%" direction="rtl">
|
||||||
|
<CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" @refresh="fetchCellList" />
|
||||||
|
</el-drawer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -123,15 +286,18 @@ onMounted(() => {
|
||||||
.flex-container {
|
.flex-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
gap: 20px;
|
gap: 12px;
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
|
|
||||||
.cabinet-info-card {
|
.cabinet-info-card {
|
||||||
width: 30%;
|
width: 20%;
|
||||||
|
height: 88vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-card {
|
.info-card {
|
||||||
width: 70%;
|
width: 80%;
|
||||||
|
height: 88vh;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -12,6 +12,7 @@ import Refresh from "@iconify-icons/ep/refresh";
|
||||||
import View from "@iconify-icons/ep/view";
|
import View from "@iconify-icons/ep/view";
|
||||||
import AddFill from "@iconify-icons/ri/add-circle-line";
|
import AddFill from "@iconify-icons/ri/add-circle-line";
|
||||||
import SmartCabinetCardFormModal from "./smart-cabinet-card-form-modal.vue";
|
import SmartCabinetCardFormModal from "./smart-cabinet-card-form-modal.vue";
|
||||||
|
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||||
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
|
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
|
@ -62,6 +63,16 @@ const resetForm = formEl => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleViewDetail = (row: SmartCabinetDTO) => {
|
const handleViewDetail = (row: SmartCabinetDTO) => {
|
||||||
|
// 保存信息到标签页
|
||||||
|
useMultiTagsStoreHook().handleTags("push", {
|
||||||
|
path: `/cabinet/card/detail`,
|
||||||
|
name: "smartCabinetCardDetail",
|
||||||
|
query: { id: row.cabinetId },
|
||||||
|
meta: {
|
||||||
|
title: `${row.cabinetName}`,
|
||||||
|
dynamicLevel: 3
|
||||||
|
}
|
||||||
|
});
|
||||||
router.push({
|
router.push({
|
||||||
path: '/cabinet/card/detail',
|
path: '/cabinet/card/detail',
|
||||||
query: {
|
query: {
|
||||||
|
|
|
@ -2,10 +2,11 @@
|
||||||
import { ref, reactive, watch } from "vue";
|
import { ref, reactive, watch } from "vue";
|
||||||
import { ElMessage, FormRules } from "element-plus";
|
import { ElMessage, FormRules } from "element-plus";
|
||||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||||
import { GoodsDTO, updateGoodsApi, addGoodsApi } from "@/api/shop/goods";
|
import { GoodsDTO, updateGoodsApi, addGoodsApi, deleteGoodsApi } from "@/api/shop/goods";
|
||||||
import { CategoryDTO, getCategoryAllApi } from "@/api/shop/category";
|
import { CategoryDTO, getCategoryAllApi } from "@/api/shop/category";
|
||||||
import Confirm from "@iconify-icons/ep/check";
|
import Confirm from "@iconify-icons/ep/check";
|
||||||
import Upload from "@iconify-icons/ep/upload";
|
import Upload from "@iconify-icons/ep/upload";
|
||||||
|
import Delete from "@iconify-icons/ep/delete";
|
||||||
const { VITE_APP_BASE_API } = import.meta.env;
|
const { VITE_APP_BASE_API } = import.meta.env;
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
@ -121,10 +122,20 @@ watch(
|
||||||
if (val) initForm();
|
if (val) initForm();
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
const handleDelete = async () => {
|
||||||
|
try {
|
||||||
|
await deleteGoodsApi(formData.goodsId);
|
||||||
|
ElMessage.success("删除成功");
|
||||||
|
emit("refresh");
|
||||||
|
closeDialog();
|
||||||
|
} catch (error) {
|
||||||
|
console.error("删除失败", error);
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<el-dialog :title="isEdit ? '编辑商品' : '新增商品'" :model-value="visible" width="600px" @close="closeDialog">
|
<el-drawer :title="isEdit ? '编辑商品' : '新增商品'" :model-value="visible" size="50%" direction="rtl" @close="closeDialog">
|
||||||
<el-form ref="formRef" :model="formData" :rules="rules" label-width="80px" label-position="right">
|
<el-form ref="formRef" :model="formData" :rules="rules" label-width="80px" label-position="right">
|
||||||
<el-form-item label="商品名称" prop="goodsName">
|
<el-form-item label="商品名称" prop="goodsName">
|
||||||
<el-input v-model="formData.goodsName" placeholder="请输入商品名称" clearable />
|
<el-input v-model="formData.goodsName" placeholder="请输入商品名称" clearable />
|
||||||
|
@ -165,6 +176,15 @@ watch(
|
||||||
<el-radio :label="2">下架</el-radio>
|
<el-radio :label="2">下架</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item label="操作">
|
||||||
|
<el-popconfirm :title="`确认删除【${row.goodsName}】?`" @confirm="handleDelete()">
|
||||||
|
<template #reference>
|
||||||
|
<el-button type="danger" link :icon="useRenderIcon(Delete)" class="right-btn">
|
||||||
|
删除该商品
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-popconfirm>
|
||||||
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<template #footer>
|
<template #footer>
|
||||||
|
@ -173,7 +193,7 @@ watch(
|
||||||
确认
|
确认
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-drawer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
@ -202,13 +202,13 @@ const handleEdit = (row: GoodsDTO) => {
|
||||||
@click="currentRow = row; configVisible = true">
|
@click="currentRow = row; configVisible = true">
|
||||||
配置格口
|
配置格口
|
||||||
</el-button> -->
|
</el-button> -->
|
||||||
<el-popconfirm :title="`确认删除【${row.goodsName}】?`" @confirm="handleDelete(row)">
|
<!-- <el-popconfirm :title="`确认删除【${row.goodsName}】?`" @confirm="handleDelete(row)">
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<el-button type="danger" link :icon="useRenderIcon(Delete)" class="right-btn">
|
<el-button type="danger" link :icon="useRenderIcon(Delete)" class="right-btn">
|
||||||
删除
|
删除
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-popconfirm>
|
</el-popconfirm> -->
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
|
@ -9,6 +9,7 @@ import Search from "@iconify-icons/ep/search";
|
||||||
import Refresh from "@iconify-icons/ep/refresh";
|
import Refresh from "@iconify-icons/ep/refresh";
|
||||||
import View from "@iconify-icons/ep/view";
|
import View from "@iconify-icons/ep/view";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "Ab98User"
|
name: "Ab98User"
|
||||||
|
@ -56,7 +57,17 @@ const resetForm = formEl => {
|
||||||
onSearch();
|
onSearch();
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleViewDetail = (row: any) => {
|
const handleViewDetail = (row: Ab98UserDTO) => {
|
||||||
|
// 保存信息到标签页
|
||||||
|
useMultiTagsStoreHook().handleTags("push", {
|
||||||
|
path: `/user/ab98/detail`,
|
||||||
|
name: "ab98Detail",
|
||||||
|
query: { id: row.ab98UserId },
|
||||||
|
meta: {
|
||||||
|
title: `${row.name}`,
|
||||||
|
dynamicLevel: 3
|
||||||
|
}
|
||||||
|
});
|
||||||
router.push({
|
router.push({
|
||||||
path: '/user/ab98/detail',
|
path: '/user/ab98/detail',
|
||||||
query: {
|
query: {
|
||||||
|
|
Loading…
Reference in New Issue