admin123
/
shop-front-end
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: admin123:ba27975609be558989c78717c86c660be1161eff
Branches Tags
admin123:master
..
compare: admin123:7319fae44748c828e6f462854a22fe65ec74e498
Branches Tags
admin123:master

No commits in common. "ba27975609be558989c78717c86c660be1161eff" and "7319fae44748c828e6f462854a22fe65ec74e498" have entirely different histories.
ba27975609 ... 7319fae447

32 changed files with 258 additions and 1594 deletions
Show Stats Expand all files Collapse all files

2
index.html
View File

@ -7,7 +7,7 @@
<meta name="renderer" content="webkit" />
<meta name="viewport"
content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0" />
<title>智柜通</title>
<title>智借还</title>
<link rel="icon" href="/favicon.ico" />
<script>
window.process = {};

8
public/img/product-image.svg
View File

@ -1,8 +0,0 @@
<svg width="80" height="80" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect x="5" y="5" width="90" height="90" rx="10" fill="#E8F5E9" stroke="#81C784"
stroke-width="2" />
<text x="50" y="45" font-family="Arial, sans-serif" font-size="24" font-weight="bold"
fill="#2E7D32" text-anchor="middle">空闲</text>
<text x="50" y="75" font-family="Arial, sans-serif" font-size="12"
fill="#2E7D32" text-anchor="middle">小格</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 482 B

2
public/serverConfig.json
View File

@ -1,6 +1,6 @@
{
"Version": "4.4.0",
"Title": "智柜通",
"Title": "智借还",
"FixedHeader": true,
"HiddenSideBar": false,
"MultiTagsCache": false,

10
src/api/ab98/user.ts
View File

@ -84,12 +84,6 @@ export interface UpdateAb98UserCommand extends AddAb98UserCommand {
ab98UserId: number;
}
export interface BindQyUserCommand {
qyUserId: number;
name: string;
idNum: string;
}
export const getAb98UserListApi = (params: Ab98UserQuery) => {
return http.request<ResponseData<PageDTO<Ab98UserDTO>>>("get", "/ab98/users", { params });
};
@ -108,8 +102,4 @@ export const deleteAb98UserApi = (ids: number[]) => {
export const getAb98UserDetailApi = (id: number) => {
return http.request<ResponseData<Ab98UserDetailDTO>>("get", `/ab98/users/detail/${id}`);
};
export const bindQyUserApi = (data: BindQyUserCommand) => {
return http.request<ResponseData<void>>("post", "/ab98/users/bindQyUser", { data });
};

37
src/api/cabinet/smart-cabinet.ts
View File

@ -45,10 +45,6 @@ export interface SmartCabinetDTO {
belongType?: number;
usedCells?: number;
availableCells?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
/**
@ -73,10 +69,6 @@ export interface AddSmartCabinetCommand {
location: number;
/** 归属类型（0-借还柜 1-固资通） */
belongType: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
/**
@ -103,10 +95,6 @@ export interface UpdateSmartCabinetCommand {
location?: number;
/** 归属类型（0-借还柜 1-固资通） */
belongType?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
export interface AllCabinetDataDTO {
@ -120,13 +108,6 @@ export const getSmartCabinetList = (params?: SmartCabinetQuery) => {
});
};
export const getSmartCabinetListQuery = (params?: SmartCabinetQuery) => {
return http.request<ResponseData<SmartCabinetDTO[]>>('get', '/cabinet/smartCabinet/list', {
params
});
};
export const addSmartCabinet = (data: AddSmartCabinetCommand) => {
return http.request<ResponseData<void>>('post', '/cabinet/smartCabinet', {
data
@ -153,20 +134,4 @@ export const allCabinets = () => {
export const getSmartCabinetDetailApi = (cabinetId: number) => {
return http.request<ResponseData<SmartCabinetDTO>>("get", `/cabinet/smartCabinet/detail/${cabinetId}`);
};
/**
* 获取借呗支付状态文字描述
* @param balanceEnable 借呗支付状态数字
*/
export const getBalanceEnableText = (balanceEnable?: number) => {
switch (balanceEnable) {
case 0:
return '禁止使用';
case 1:
return '正常使用';
default:
return '未知状态';
}
};
};

68
src/api/common/login.ts
View File

@ -37,8 +37,6 @@ export type TokenDTO = {
token: string;
/** 当前登录的用户 */
currentUser: CurrentLoginUserDTO;
/** 企业微信用户信息 */
qyUser: QyUserLoginDTO;
};
export type CurrentLoginUserDTO = {
@ -123,68 +121,4 @@ type qyUserinfoQuery = {
/** 获取企业微信访问用户身份接口 */
export const getQyUserinfo = (params: qyUserinfoQuery) => {
return http.request<ResponseData<string>>("get", "/getQyUserinfo", { params });
};
export interface QyUserLoginDTO {
/** 用户ID */
id?: number;
/** 全局唯一ID */
openUserid?: string;
/** 企业用户ID */
userid?: string;
/** 汇邦云用户ID */
ab98UserId?: number;
/** 用户姓名 */
name?: string;
/** 手机号码 */
mobile?: string;
/** 所属部门 */
department?: string;
/** 部门排序 */
userOrder?: string;
/** 职务信息 */
position?: string;
/** 性别 */
gender?: string;
/** 邮箱 */
email?: string;
/** 企业邮箱 */
bizMail?: string;
/** 部门负责人 */
isLeaderInDept?: string;
/** 直属上级 */
directLeader?: string;
/** 头像地址 */
avatar?: string;
/** 座机号码 */
telephone?: string;
/** 别名 */
alias?: string;
/** 激活状态 */
status?: string;
/** 个人二维码 */
qrCode?: string;
/** 操作人 */
operator?: string;
/** 有效状态 */
enableStatus?: string;
/** 创建时间 */
createTimeStr?: string;
/** 企业ID */
corpid?: string;
/** 应用ID */
appid?: string;
/** 用户余额 */
balance?: number;
/** 已使用用户余额 */
useBalance?: number;
/** 用户余额额度 */
balanceLimit?: number;
/** 系统角色ID */
sysRoleId?: number;
/** 角色ID */
roleId?: number;
/** 角色名称 */
roleName?: string;
}
};

16
src/api/shop/goods.ts
View File

@ -1,19 +1,11 @@
import { http } from "@/utils/http";
export interface GoodsQuery extends BasePageQuery {
/** 商品名称 */
goodsName?: string;
categoryId?: number;
/** 商品状态（0下架 1上架） */
status?: number;
/** 商品ID */
goodsId?: number;
/** 自动审批开关（0关闭 1开启） */
autoApproval?: number;
/** 所属类型（0智借还 1固资通） */
belongType?: number;
/** 企业微信ID */
corpid: string;
}
/** 商品DTO */
@ -24,8 +16,6 @@ export interface GoodsDTO {
goodsName: string;
/** 商品分类ID */
categoryId: number;
/** 企业微信ID */
corpid: string;
/** 商品价格 */
price: number;
/** 库存数量 */
@ -56,14 +46,10 @@ export interface GoodsDTO {
cellNo?: number;
/** 单元格编号（字符串形式） */
cellNoStr?: string;
/** 所属店铺名称 */
shopNameStr?: string;
/** 总库存量（含所有仓库） */
totalStock?: number;
/** 商品使用说明 */
usageInstruction?: string;
/** 所属类型（0智借还 1固资通） */
belongType: number;
}
/** 商品请求参数 */
@ -79,8 +65,6 @@ export interface GoodsRequest {
remark?: string;
/** 商品使用说明 */
usageInstruction?: string;
/** 企业微信ID */
corpid: string;
}
/** 获取商品列表 */

1
src/api/shop/order.ts
View File

@ -15,7 +15,6 @@ export interface OrderQuery extends BasePageQuery {
cabinetId?: number;
/** 格口id */
cellId?: number;
goodsId?: number;
/**
* 订单状态
* @remarks

74
src/api/shop/shop.ts
View File

@ -3,91 +3,24 @@ import { http } from '@/utils/http';
/** 商店分页查询参数 */
export interface ShopQuery extends BasePageQuery {
shopName?: string;
corpid?: string;
/** 归属类型（0-借还柜 1-固资通） */
belongType?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
/** 商店DTO */
export interface ShopDTO {
shopId: number;
shopName: string;
corpid?: string;
/** 封面图URL */
coverImg?: string;
/** 归属类型（0-借还柜 1-固资通） */
belongType?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
/** 新增商店命令 */
export interface AddShopCommand {
shopName: string;
corpid: string;
/** 封面图URL */
coverImg?: string;
/** 归属类型（0-借还柜 1-固资通） */
belongType?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
}
/** 更新商店命令 */
export interface UpdateShopCommand {
corpid: string;
shopId: number;
shopName: string;
/** 封面图URL */
coverImg?: string;
/** 归属类型（0-借还柜 1-固资通） */
belongType?: number;
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式） */
mode?: number;
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable?: number;
};
// 运行模式文字映射
const modeTextMap = {
0: '支付模式',
1: '审批模式',
2: '借还模式',
3: '会员模式',
4: '耗材模式'
};
// 借呗支付状态文字映射
const balanceEnableTextMap = {
0: '禁止使用',
1: '正常使用'
};
/**
* 将运行模式数值转换为文字描述
* @param mode 运行模式数值
* @returns 对应的文字描述，未知值返回空字符串
*/
export const getModeText = (mode?: number): string => {
return mode !== undefined ? modeTextMap[mode] || '' : '';
};
/**
* 将借呗支付状态转换为文字描述
* @param balanceEnable 借呗支付状态数值
* @returns 对应的文字描述，未知值返回空字符串
*/
export const getBalanceEnableText = (balanceEnable?: number): string => {
return balanceEnable !== undefined ? balanceEnableTextMap[balanceEnable] || '' : '';
};
}
/** 获取商店列表 */
export const getShopList = (params?: ShopQuery) => {
@ -96,11 +29,6 @@ export const getShopList = (params?: ShopQuery) => {
});
};
/** 获取商店详情 */
export const getShopById = (id: number) => {
return http.request<ResponseData<ShopDTO>>('get', `/shop/shops/${id}`);
};
/** 新增商店 */
export const addShop = (data: AddShopCommand) => {
return http.request<ResponseData<void>>('post', '/shop/shops', {

1
src/router/index.ts
View File

@ -130,7 +130,6 @@ router.beforeEach(async (to: ToRouteType, _from, next) => {
});
// 登录成功后 将token存储到sessionStorage中
setTokenFromBackend(data);
wxStore.setQyUser(data.qyUser);
// 获取后端路由
await initRouter();
next({ path: getTopMenu(true).path });

8
src/router/modules/global.ts
View File

@ -39,14 +39,6 @@ export default {
meta: {
title: "用户详情"
}
},
{
path: "/shop/goods/detail",
name: "GoodsDetail",
component: () => import("@/views/shop/goods/detail.vue"),
meta: {
title: "商品详情"
}
}
]
} as RouteConfigsTable;

12
src/store/modules/wx.ts
View File

@ -2,7 +2,6 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { store } from "@/store";
import { QyUserLoginDTO } from "@/api/common/login";
export const useWxStore = defineStore("wx", () => {
@ -16,18 +15,12 @@ export const useWxStore = defineStore("wx", () => {
const userid = ref<string>("")
// 初始化
const isInit = ref<boolean>(false);
const qyUser = ref<QyUserLoginDTO>(null);
// 设置 userid
const setUserid = (id: string) => {
userid.value = id
}
const setQyUser = (user: QyUserLoginDTO) => {
if (!user) return;
qyUser.value = user;
}
const initWx = () => {
if (isInit.value) return;
isInit.value = true;
@ -56,10 +49,7 @@ export const useWxStore = defineStore("wx", () => {
}
}
return {
corpid, code, state, userid, isInit, qyUser,
setUserid, handleWxCallback, initWx, setQyUser
}
return { corpid, code, state, userid, isInit, setUserid, handleWxCallback, initWx }
})
/**

4
src/utils/cabinetImgMap.ts
View File

@ -35,8 +35,4 @@ export const CabinetImgMap = {
img: "cabinet_4.jpg",
name: "4格柜",
},
10: {
img: "cabinet_16.jpg",
name: "10格柜",
},
}

72
src/views/cabinet/cabinet-cell/cell-edit-modal.vue
View File

@ -1,8 +1,8 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ElMessage } from "element-plus";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { updateCabinetCell, clearGoodsCells } from "@/api/cabinet/cabinet-cell";
import { updateCabinetCell } from "@/api/cabinet/cabinet-cell";
import Confirm from "@iconify-icons/ep/check";
import type { FormRules } from 'element-plus';
@ -15,7 +15,6 @@ export interface FormDTO {
cellType: number;
availableStatus: number;
usageStatus: number;
stock: number;
}
const props = defineProps({
@ -39,8 +38,7 @@ const formData = reactive<FormDTO>({
pinNo: null,
cellType: 1,
availableStatus: 1,
usageStatus: 1,
stock: 0
usageStatus: 1
});
const rules = reactive<FormRules>({
@ -88,22 +86,6 @@ const closeDialog = () => {
emit('update:modelValue', false);
};
async function handleClearGoods() {
try {
await ElMessageBox.confirm(
`确认要下架${props.row.goodsName}吗？`,
'警告',
{ confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }
);
await clearGoodsCells(props.row.cellId);
ElMessage.success('商品下架成功');
emit('refresh');
closeDialog();
} catch (error) {
console.error('操作取消或失败', error);
}
}
watch(() => props.row, (val) => {
if (val) {
Object.assign(formData, val);
@ -113,10 +95,18 @@ watch(() => props.row, (val) => {
<template>
<el-form ref="formRef" :model="formData" :rules="rules" label-width="100px">
<el-form-item label="柜体ID" prop="cabinetId">
<el-input v-model.number="formData.cabinetId" placeholder="请输入柜体ID" />
</el-form-item>
<el-form-item label="主板ID" prop="mainboardId">
<el-input v-model.number="formData.mainboardId" placeholder="请输入主板ID" />
</el-form-item>
<el-form-item label="单元格号" prop="cellNo">
<el-input v-model.number="formData.cellNo" placeholder="请输入单元格号" />
</el-form-item>
<el-form-item label="针脚号" prop="pinNo">
<el-input v-model.number="formData.pinNo" placeholder="请输入针脚号" />
</el-form-item>
@ -130,35 +120,23 @@ watch(() => props.row, (val) => {
</el-select>
</el-form-item>
<el-form-item v-if="props.row.goodsId" label="商品ID">
<el-input :model-value="props.row.goodsId" disabled />
</el-form-item>
<el-form-item v-if="props.row.goodsId" label="商品名称">
<el-input :model-value="props.row.goodsName" disabled />
</el-form-item>
<el-form-item v-if="props.row.goodsId" label="商品图片">
<el-image :src="props.row.coverImg" style="width: 100px; height: 100px" fit="contain" />
</el-form-item>
<el-form-item v-if="props.row.goodsId" label="价格">
<el-input :model-value="props.row.price" disabled />
</el-form-item>
<el-form-item v-if="props.row.goodsId" label="库存" prop="stock">
<el-input-number v-model="formData.stock" :min="0" :max="1000" class="stock-input" />
<el-form-item label="使用状态" prop="usageStatus">
<el-select v-model="formData.usageStatus" placeholder="请选择状态">
<el-option label="空闲" :value="1" />
<el-option label="已占用" :value="2" />
</el-select>
</el-form-item>
<el-form-item label="可用状态" prop="availableStatus">
<el-select v-model="formData.availableStatus" placeholder="请选择状态">
<el-option label="正常" :value="1" />
<el-option label="故障" :value="2" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleConfirm" class="save-btn">
保存修改
</el-button>
<el-button v-if="props.row.goodsId" type="danger" @click="handleClearGoods" class="clear-btn">
下架商品
<el-button type="primary" :icon="useRenderIcon(Confirm)" @click="handleConfirm">
提交
</el-button>
</el-form-item>
</el-form>
</template>
<style scoped lang="scss">
.save-btn, .clear-btn {
margin-right: 10px;
}
</style>
</template>

263
src/views/cabinet/shop/card.vue
View File

@ -1,263 +0,0 @@
<script setup lang="ts">
import { onMounted, ref } from "vue";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { getShopList, type ShopDTO, ShopQuery, getModeText, getBalanceEnableText } from "@/api/shop/shop";
import { type PaginationProps } from "@pureadmin/table";
import { useRouter } from "vue-router";
import { useWxStore } from "@/store/modules/wx";
import Search from "@iconify-icons/ep/search";
import Refresh from "@iconify-icons/ep/refresh";
import View from "@iconify-icons/ep/view";
import AddFill from "@iconify-icons/ri/add-circle-line";
import ShopFormModal from "./shop-form-modal.vue";
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
defineOptions({
name: "ShopCard"
});
const router = useRouter();
const wxStore = useWxStore();
const formRef = ref();
const modalVisible = ref(false);
const currentRow = ref<ShopDTO | null>(null);
const searchFormParams = ref<ShopQuery>({
shopName: "",
corpid: wxStore.corpid
});
const pageLoading = ref(false);
const dataList = ref<ShopDTO[]>([]);
const pagination = ref<PaginationProps>({
total: 0,
pageSize: 12,
currentPage: 1,
background: true
});
async function onSearch() {
pagination.value.currentPage = 1;
getList();
}
async function getList() {
try {
pageLoading.value = true;
const { data } = await getShopList({
...searchFormParams.value,
corpid: wxStore.corpid,
pageSize: pagination.value.pageSize,
pageNum: pagination.value.currentPage
});
dataList.value = data.rows;
pagination.value.total = data.total;
} finally {
pageLoading.value = false;
}
}
const resetForm = formEl => {
if (!formEl) return;
formEl.resetFields();
onSearch();
};
const handleViewDetail = (row: ShopDTO) => {
currentRow.value = row;
modalVisible.value = true;
};
function getModeType(mode: number): "" | "success" | "warning" | "info" | "danger" {
switch (mode) {
case 0: return 'success';
case 1: return 'info';
case 2: return 'warning';
case 3: return 'danger';
default: return '';
}
}
function getBalanceType(enable: number): "" | "success" | "warning" | "info" | "danger" {
return enable == 1 ? 'success' : 'danger';
}
onMounted(() => {
getList();
});
</script>
<template>
<div class="main">
<div class="float-right w-full">
<el-form ref="formRef" :inline="true" :model="searchFormParams"
class="search-form bg-bg_color flex w-[99/100] pl-[22px] pt-[12px]">
<el-form-item label="" prop="shopName">
<el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.shopName" placeholder="请输入地址名称"
clearable class="!w-[200px]" />
</el-form-item>
<el-form-item>
<el-button type="primary" :icon="useRenderIcon(Search)" :loading="pageLoading" @click="onSearch">
搜索
</el-button>
</el-form-item>
<el-form-item class="space-item">
</el-form-item>
<el-form-item>
<el-button type="primary" :icon="useRenderIcon(AddFill)" @click="modalVisible = true; currentRow = null"
style="margin-right: 10px;">
新增地址
</el-button>
</el-form-item>
</el-form>
<div class="grid-container">
<el-row :gutter="12">
<el-col v-for="(item, index) in dataList" :key="item.shopId" :xs="24" :sm="12" :md="8" :lg="4" :xl="4">
<el-card class="cabinet-card" :body-style="{ padding: '8px 10px' }">
<div class="card-content">
<img v-if="item.coverImg" :src="item.coverImg" alt="" class="cabinet-image">
<svg v-if="!item.coverImg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 100" width="160" height="100"
class="cabinet-image">
<!-- 背景：浅灰色填充，模拟图片容器 -->
<rect width="100%" height="100%" fill="#f8f8f8" rx="4" ry="4" /> <!-- 可选圆角，适配卡片风格 -->
<!-- 图片图标：简化的“图片”符号（矩形+交叉线），直观关联“图片” -->
<g stroke="#ccc" stroke-width="2" fill="none">
<rect x="20" y="10" width="120" height="65" /> <!-- 图片框 -->
<line x1="20" y1="10" x2="140" y2="75" /> <!-- 对角线1 -->
<line x1="140" y1="10" x2="20" y2="75" /> <!-- 对角线2 -->
</g>
<!-- 说明文字：明确提示“未设置图片”，居中对齐 -->
<text x="50%" y="92" font-size="12" fill="#888" text-anchor="middle" font-family="Arial, sans-serif">
未设置图片
</text>
</svg>
<el-descriptions class="cabinet-info" :column="1">
<!-- <el-descriptions-item class="type">模式：{{ item.belongType === 0 ? '借还模式' : '固资模式' }}</el-descriptions-item> -->
<el-descriptions-item class="mode">运行模式：<el-tag :type="getModeType(item.mode)">{{ getModeText(item.mode) }}</el-tag></el-descriptions-item>
<el-descriptions-item class="balance">借呗支付：<el-tag :type="getBalanceType(item.balanceEnable)">{{ getBalanceEnableText(item.balanceEnable) }}</el-tag></el-descriptions-item>
</el-descriptions>
</div>
<el-divider class="divider" />
<el-button class="detail-btn" link @click="handleViewDetail(item)">
{{ item.shopName }}
</el-button>
</el-card>
</el-col>
</el-row>
<div class="pagination-wrapper">
<el-pagination background layout="prev, pager, next" :page-size="pagination.pageSize"
:total="pagination.total" v-model:current-page="pagination.currentPage" @current-change="getList"
@size-change="getList" />
</div>
</div>
</div>
<shop-form-modal v-model:visible="modalVisible" :row="currentRow" @refresh="getList" />
</div>
</template>
<style scoped lang="scss">
.search-form {
:deep(.el-form-item) {
margin-bottom: 12px;
margin-right: 12px;
}
}
:deep(.el-descriptions__cell) {
padding-bottom: 1px !important;
}
.cabinet-card {
margin-bottom: 12px;
min-height: 190px;
display: flex;
flex-direction: column;
justify-content: space-between;
.cabinet-image {
width: 50%;
height: 130px;
padding: 0 3px;
object-fit: contain;
border-radius: 4px;
margin-bottom: 10px;
}
.card-content {
flex: 1;
margin: 0px;
display: flex;
flex-direction: row;
.cabinet-info {
text-align: left;
padding: 16px 0px;
.name,
.type,
.shop,
.location,
.template {
width: 100%;
font-size: 14px;
color: #606266;
margin-bottom: 12px;
line-height: 1;
text-align: left;
}
.name {
width: 100%;
font-weight: 500;
color: #303133;
}
}
}
.divider {
margin: 5px 0px;
}
.detail-btn {
width: 100%;
border: 0;
margin-top: auto;
padding: 8px 0;
&:hover {
color: var(--el-color-primary);
}
}
}
.grid-container {
margin: 12px 0;
position: relative;
.el-row {
margin-bottom: -20px;
}
}
.pagination-wrapper {
position: relative;
background: var(--el-bg-color);
padding: 8px 12px;
margin-top: 20px;
text-align: center;
:deep(.el-pagination) {
margin: 0;
padding: 4px 0;
}
}
.space-item {
flex: 1;
width: 100%;
}
</style>

9
src/views/cabinet/shop/index.vue
View File

@ -13,13 +13,11 @@ import { ElMessage, ElMessageBox } from "element-plus";
import ShopFormModal from "./shop-form-modal.vue";
import ReQrcode from "@/components/ReQrcode";
import { copyTextToClipboard } from "@pureadmin/utils";
import { useWxStore } from "@/store/modules/wx";
defineOptions({
name: "Shop"
});
const wxStore = useWxStore();
const formRef = ref();
const tableRef = ref();
const modalVisible = ref(false);
@ -30,7 +28,6 @@ const handleRefresh = () => {
};
const searchFormParams = ref<ShopQuery>({
corpid: wxStore.corpid,
shopName: ""
});
@ -51,7 +48,6 @@ const getList = async () => {
loading.value = true;
const { data } = await getShopList({
...searchFormParams.value,
corpid: wxStore.corpid,
pageSize: pagination.value.pageSize,
pageNum: pagination.value.currentPage
});
@ -166,11 +162,6 @@ getList();
<el-table-column type="selection" width="55" />
<el-table-column label="地址ID" prop="shopId" width="100" />
<el-table-column label="地址名称" prop="shopName" />
<el-table-column label="商品模式" prop="belongType" width="120">
<template #default="{ row }">
{{ row.belongType === 0 ? '借还模式' : '固资模式' }}
</template>
</el-table-column>
<el-table-column label="操作" width="150" fixed="right">
<template #default="{ row }">
<el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEdit(row)">

138
src/views/cabinet/shop/shop-form-modal.vue
View File

@ -1,10 +1,7 @@
<script setup lang="ts">
import { ref, watch, onMounted } from "vue";
import { ref, watch } from "vue";
import { ElMessage } from "element-plus";
import { addShop, updateShop, ShopDTO, UpdateShopCommand, AddShopCommand } from "@/api/shop/shop";
import { useWxStore } from "@/store/modules/wx";
import Upload from "@iconify-icons/ep/upload";
const { VITE_APP_BASE_API } = import.meta.env;
import { addShop, updateShop, ShopDTO, UpdateShopCommand } from "@/api/shop/shop";
const props = defineProps({
visible: {
@ -19,25 +16,14 @@ const props = defineProps({
const emit = defineEmits(["update:visible", "refresh"]);
const wxStore = useWxStore();
const formRef = ref();
const formData = ref<UpdateShopCommand>({
corpid: wxStore.corpid,
shopId: 0,
shopName: "",
belongType: undefined,
mode: undefined,
balanceEnable: undefined,
coverImg: ""
shopName: ""
});
const rules = {
shopName: [{ required: true, message: "请输入地址名称", trigger: "blur" }],
belongType: [{ required: true, message: "请选择商品模式", trigger: "change" }],
mode: [{ required: true, message: "请选择运行模式", trigger: "change" }],
balanceEnable: [{ required: true, message: "请选择借呗支付状态", trigger: "change" }],
coverImg: [{ required: true, message: "请上传封面图", trigger: "change" }]
shopName: [{ required: true, message: "请输入地址名称", trigger: "blur" }]
};
watch(
@ -47,27 +33,16 @@ watch(
if (props.row?.shopId) {
formData.value = {
...props.row,
shopId: props.row.shopId,
corpid: props.row.corpid,
belongType: props.row.belongType,
mode: props.row.mode,
balanceEnable: props.row.balanceEnable,
coverImg: props.row.coverImg || ""
shopId: props.row.shopId
};
} else {
formData.value = {
shopId: 0,
shopName: "",
corpid: wxStore.corpid,
belongType: undefined,
mode: undefined,
balanceEnable: undefined,
coverImg: ""
shopName: ""
};
}
}
},
{ immediate: true }
}
);
const handleSubmit = async () => {
@ -92,27 +67,11 @@ const handleSubmit = async () => {
const handleClose = () => {
emit("update:visible", false);
};
const handleAvatarSuccess = (response) => {
formData.value.coverImg = response.data.url;
};
const beforeAvatarUpload = (rawFile) => {
if (!['image/jpeg', 'image/png'].includes(rawFile.type)) {
ElMessage.error('封面图必须是 JPG/PNG 格式!');
return false;
}
if (rawFile.size > 50 * 1024 * 1024) {
ElMessage.error('封面图大小不能超过 50MB!');
return false;
}
return true;
};
</script>
<template>
<el-drawer :title="formData.shopId ? '编辑地址' : '新增地址'" :model-value="visible" @update:model-value="handleClose"
size="600px" direction="rtl">
<el-dialog :title="formData.shopId ? '编辑地址' : '新增地址'" :model-value="visible" @update:model-value="handleClose"
width="600px">
<el-form ref="formRef" :model="formData" :rules="rules" label-width="100px">
<el-form-item label="地址ID" prop="shopId" v-if="formData.shopId">
<el-input v-model="formData.shopId" :disabled="true" />
@ -120,83 +79,10 @@ const beforeAvatarUpload = (rawFile) => {
<el-form-item label="地址名称" prop="shopName">
<el-input v-model="formData.shopName" placeholder="请输入地址名称" />
</el-form-item>
<el-form-item label="封面图" prop="coverImg">
<el-upload class="avatar-uploader" :action="VITE_APP_BASE_API + '/file/upload'" :show-file-list="false"
:on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
<img v-if="formData.coverImg" :src="formData.coverImg" class="avatar" />
<svg v-if="!formData.coverImg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 100" width="160" height="100"
class="cabinet-image">
<!-- 背景：浅灰色填充，模拟图片容器 -->
<rect width="100%" height="100%" fill="#f8f8f8" rx="4" ry="4" /> <!-- 可选圆角，适配卡片风格 -->
<!-- 图片图标：简化的“图片”符号（矩形+交叉线），直观关联“图片” -->
<g stroke="#ccc" stroke-width="2" fill="none">
<rect x="20" y="10" width="120" height="65" /> <!-- 图片框 -->
<line x1="20" y1="10" x2="140" y2="75" /> <!-- 对角线1 -->
<line x1="140" y1="10" x2="20" y2="75" /> <!-- 对角线2 -->
</g>
<!-- 说明文字：明确提示“未设置图片”，居中对齐 -->
<text x="50%" y="92" font-size="12" fill="#888" text-anchor="middle" font-family="Arial, sans-serif">
未设置图片
</text>
</svg>
</el-upload>
</el-form-item>
<!-- <el-form-item label="商品模式" prop="belongType">
<el-select v-model="formData.belongType" placeholder="请选择归属类型">
<el-option label="借还模式" :value="0" />
<el-option label="固资模式" :value="1" />
</el-select>
</el-form-item> -->
<el-form-item label="运行模式" prop="mode">
<el-select v-model="formData.mode" placeholder="请选择运行模式">
<el-option label="支付模式" :value="0" />
<el-option label="审批模式" :value="1" />
<el-option label="借还模式" :value="2" />
<el-option label="会员模式" :value="3" />
<el-option label="耗材模式" :value="4" />
</el-select>
</el-form-item>
<el-form-item label="借呗支付" prop="balanceEnable">
<el-select v-model="formData.balanceEnable" placeholder="请选择借呗支付状态">
<el-option label="正常使用" :value="1" />
<el-option label="禁止使用" :value="0" />
</el-select>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="handleClose" style="margin-right: 5px;">取消</el-button>
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="handleSubmit">确定</el-button>
</template>
</el-drawer>
</template>
<style scoped>
.avatar-uploader {
:deep(.el-upload) {
border: 1px dashed var(--el-border-color);
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: var(--el-transition-duration-fast);
&:hover {
border-color: var(--el-color-primary);
}
}
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.cabinet-image {
width: 100%;
height: 100%;
padding: 0;
object-fit: contain;
border-radius: 4px;
}
</style>
</el-dialog>
</template>

117
src/views/cabinet/smart-cabinet-card/configured-goods-modal.vue
View File

@ -1,117 +0,0 @@
<script setup lang="ts">
import { ref } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { changeGoodsCellsStock, clearGoodsCells } from "@/api/cabinet/cabinet-cell";
import { getGoodsInfo } from "@/api/shop/goods";
const props = defineProps({
cellId: {
type: Number,
required: true
},
goodsId: {
type: Number,
required: true
},
goodsName: {
type: String,
required: true
},
currentStock: {
type: Number,
required: true
},
coverImg: {
type: String,
required: true
},
price: {
type: Number,
required: true
}
});
const emit = defineEmits(['refresh', 'update:modelValue']);
const closeModal = () => {
emit('update:modelValue', false);
};
const stockInput = ref(props.currentStock);
const isEditing = ref(false);
async function handleStockChange() {
try {
const { data } = await getGoodsInfo(props.goodsId);
const remainingStock = data.stock - data.totalStock + props.currentStock;
if (stockInput.value > remainingStock) {
ElMessage.warning('分配数量不能超过剩余库存');
stockInput.value = remainingStock;
return;
}
await changeGoodsCellsStock(props.cellId, stockInput.value);
ElMessage.success('库存更新成功');
emit('refresh');
isEditing.value = false;
} catch (error) {
console.error('库存调整失败', error);
}
}
async function handleClearGoods() {
try {
await ElMessageBox.confirm(
`确认要下架${props.goodsName}吗？`,
'警告',
{ confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }
);
await clearGoodsCells(props.cellId);
ElMessage.success('商品下架成功');
emit('refresh');
closeModal();
} catch (error) {
console.error('操作取消或失败', error);
}
}
</script>
<template>
<div class="config-modal">
<el-descriptions :column="1" border>
<el-descriptions-item label="商品ID" >{{ props.goodsId }}</el-descriptions-item>
<el-descriptions-item label="商品名称">{{ props.goodsName }}</el-descriptions-item>
<el-descriptions-item label="商品图片">
<el-image :src="coverImg" style="width: 100px; height: 100px" fit="contain" />
</el-descriptions-item>
<el-descriptions-item label="价格">{{ price }}</el-descriptions-item>
<el-descriptions-item label="当前库存">
<el-input-number v-model="stockInput" :min="0" :max="1000" :disabled="!isEditing" class="stock-input" />
<el-button v-if="!isEditing" type="primary" size="small" @click="isEditing = true">修改</el-button>
<el-button v-if="isEditing" type="success" size="small" @click="handleStockChange">保存</el-button>
</el-descriptions-item>
</el-descriptions>
<div class="action-buttons">
<el-button type="danger" @click="handleClearGoods">
下架商品
</el-button>
</div>
</div>
</template>
<style scoped lang="scss">
.config-modal {
padding: 20px;
}
.action-buttons {
margin-top: 20px;
display: flex;
justify-content: space-around;
}
.stock-input {
margin-right: 12px;
}
</style>

303
src/views/cabinet/smart-cabinet-card/detail.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import { getSmartCabinetDetailApi, type SmartCabinetDTO, getBalanceEnableText } from "@/api/cabinet/smart-cabinet";
import { getSmartCabinetDetailApi, type SmartCabinetDTO } from "@/api/cabinet/smart-cabinet";
import { CabinetCellQuery, changeGoodsCellsStock, clearGoodsCells, getCabinetCellList, type CabinetCellDTO } from "@/api/cabinet/cabinet-cell";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { CabinetImgMap } from "@/utils/cabinetImgMap";
@ -9,7 +9,6 @@ import GatewayConfigModal from "@/views/cabinet/smart-cabinet/GatewayConfigModal
import ShopConfigModal from "@/views/cabinet/smart-cabinet/ShopConfigModal.vue";
import MainCabinetConfigModal from "@/views/cabinet/smart-cabinet/MainCabinetConfigModal.vue";
import CabinetGoodsConfigModal from "@/views/shop/cabinet-goods/cabinet-goods-config-modal.vue";
import ConfiguredGoodsModal from "./configured-goods-modal.vue";
import { ElMessage, ElMessageBox } from "element-plus";
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
import EditPen from "@iconify-icons/ep/edit-pen";
@ -22,7 +21,6 @@ import CellEditModal from "@/views/cabinet/cabinet-cell/cell-edit-modal.vue";
import { getGoodsInfo } from "@/api/shop/goods";
import EditCabinetDrawer from "./edit-cabinet-drawer.vue";
import { CabinetMainboardDTO, deleteMainboard, getMainboardList, updateMainboard } from "@/api/cabinet/mainboards";
import { getShopById, ShopDTO, getModeText } from "@/api/shop/shop";
defineOptions({
name: "SmartCabinetDetail"
@ -38,19 +36,6 @@ const cabinetInfo = ref<SmartCabinetDTO>({
lockControlNo: 0,
location: 0
});
const shopInfo = ref<ShopDTO>({
shopId: 0,
shopName: "",
corpid: '',
/** 封面图URL */
coverImg: '',
/** 归属类型（0-借还柜 1-固资通） */
belongType:0,
/** 运行模式（0-支付模式 1-审批模式 2-借还模式 3-会员模式 4-耗材模式） */
mode: -1,
/** 借呗支付（1-正常使用 0-禁止使用） */
balanceEnable: 1,
});
const loading = ref(false);
const activeTab = ref('cells');
const mainboardList = ref<CabinetMainboardDTO[]>([]);
@ -69,28 +54,18 @@ const searchCellParams = ref<CabinetCellQuery>({
goodsName: null
});
const cellPagination = ref({
pageSize: 18,
pageSize: 5,
currentPage: 1,
total: 0
});
const goodsConfigVisible = ref(false);
const configuredGoodsVisible = ref(false);
const currentCellId = ref<number>();
const cellFormVisible = ref(false);
const cellEditVisible = ref(false);
function handleConfigure(row: CabinetCellDTO) {
if (row.goodsId) {
currentCell.value = row;
configuredGoodsVisible.value = true;
} else {
if (shopInfo.value && shopInfo.value.shopId) {
currentCellId.value = row.cellId;
goodsConfigVisible.value = true;
} else {
ElMessage.error('请先配置机柜所属地址！');
}
}
currentCellId.value = row.cellId;
goodsConfigVisible.value = true;
}
async function handleStockConfig(row: CabinetCellDTO) {
@ -153,11 +128,6 @@ async function fetchCabinetDetail() {
loading.value = true;
const { data } = await getSmartCabinetDetailApi(cabinetId.value);
cabinetInfo.value = data;
// 获取关联商店信息
if (cabinetInfo.value.shopId) {
const { data: shopData } = await getShopById(cabinetInfo.value.shopId);
shopInfo.value = shopData;
}
} finally {
loading.value = false;
}
@ -287,13 +257,32 @@ onMounted(() => {
<el-divider />
<el-descriptions class="cabinet-details" :column="1" border>
<el-descriptions-item label="名称">{{ cabinetInfo.cabinetName }}</el-descriptions-item>
<el-descriptions-item label="模式">{{ getModeText(shopInfo.mode) }}</el-descriptions-item>
<el-descriptions-item label="格式">{{ CabinetImgMap[cabinetInfo.templateNo]?.name || '-'
}}</el-descriptions-item>
<el-descriptions-item label="已用">{{ cabinetInfo.usedCells || '0' }}</el-descriptions-item>
<el-descriptions-item label="未用">{{ cabinetInfo.availableCells || '0' }}</el-descriptions-item>
<el-descriptions-item label="柜址">{{ cabinetInfo.shopName || '-' }}</el-descriptions-item>
<el-descriptions-item label="柜体ID">{{ cabinetInfo.cabinetId }}</el-descriptions-item>
<el-descriptions-item label="柜体类型">
{{ cabinetInfo.cabinetType === 0 ? '主柜' : '副柜' }}
</el-descriptions-item>
<el-descriptions-item label="模板">
{{ CabinetImgMap[cabinetInfo.templateNo]?.name || '-' }}
</el-descriptions-item>
<el-descriptions-item label="归属商店">
{{ cabinetInfo.shopName || '-' }}
<el-button type="success" link :icon="useRenderIcon('ep:shop')" @click="shopConfigVisible = true">
配置
</el-button>
</el-descriptions-item>
<el-descriptions-item label="MQTT网关">
{{ cabinetInfo.mqttServerId || '-' }}
<el-button type="warning" link :icon="useRenderIcon('ant-design:gateway-outlined')"
@click="gatewayConfigVisible = true">
配置
</el-button>
</el-descriptions-item>
<el-descriptions-item label="归属主柜" v-if="cabinetInfo.cabinetType === 1">
{{ cabinetInfo.mainCabinetName || '-' }}
<el-button type="primary" link :icon="useRenderIcon('ep:setting')" @click="mainCabinetConfigVisible = true">
配置
</el-button>
</el-descriptions-item>
</el-descriptions>
</el-card>
@ -313,23 +302,13 @@ onMounted(() => {
</el-button>
</div>
<el-descriptions :column="2" border>
<el-descriptions-item label="柜体名称">{{ cabinetInfo.cabinetName || '-' }}</el-descriptions-item>
<el-descriptions-item label="运行模式">{{ getModeText(shopInfo.mode) }}</el-descriptions-item>
<el-descriptions-item label="柜体格式">{{ CabinetImgMap[cabinetInfo.templateNo]?.name || '-'
}}</el-descriptions-item>
<el-descriptions-item label="柜体地址">{{ cabinetInfo.shopName || '-' }}
<el-button type="success" link @click="shopConfigVisible = true">
配置
</el-button></el-descriptions-item>
<el-descriptions-item label="柜体网关">{{ cabinetInfo.mqttServerId || '-' }}
<el-button type="warning" link @click="gatewayConfigVisible = true">
配置
</el-button></el-descriptions-item>
<el-descriptions-item label="借呗支付">{{ getBalanceEnableText(shopInfo.balanceEnable)
}}</el-descriptions-item>
<!-- <el-descriptions-item label="商品模式">
{{ cabinetInfo.belongType === 0 ? '借还模式' : '固资模式' }}
<el-descriptions-item label="主柜ID">{{ cabinetInfo.mainCabinet || '-' }}</el-descriptions-item>
<el-descriptions-item label="主柜名称">{{ cabinetInfo.mainCabinetName || '-' }}</el-descriptions-item>
<!-- <el-descriptions-item label="归属类型">
{{ cabinetInfo.belongType === 0 ? '借还柜' : '固资通' }}
</el-descriptions-item> -->
<el-descriptions-item label="MQTT服务器ID">{{ cabinetInfo.mqttServerId || '-' }}</el-descriptions-item>
<el-descriptions-item label="操作员">{{ cabinetInfo.operator || '-' }}</el-descriptions-item>
</el-descriptions>
</div>
@ -345,61 +324,74 @@ onMounted(() => {
搜索
</el-button>
</el-form-item>
<el-form-item>
<el-button :icon="useRenderIcon(Refresh)" @click="resetCellSearch">
重置
</el-button>
</el-form-item>
</el-form>
<!-- <el-button type="primary" :size="'small'" :icon="useRenderIcon(AddFill)" @click="cellFormVisible = true">
新增格口
</el-button> -->
</div>
<el-row :gutter="12">
<el-col v-for="(item, index) in cellList" :key="item.cellId" :xs="24" :sm="12" :md="8" :lg="4" :xl="4">
<el-card class="cell-card" :body-style="{ padding: '8px 10px' }">
<div class="card-content">
<el-image v-if="item.coverImg" :src="item.coverImg" class="cell-image" fit="contain" />
<svg v-if="!item.coverImg" width="80" height="80" viewBox="0 0 100 100"
xmlns="http://www.w3.org/2000/svg" class="cell-image">
<rect x="5" y="5" width="90" height="90" rx="10" fill="#E8F5E9" stroke="#81C784" stroke-width="2" />
<!-- 添加在矩形和文本之间的虚线 -->
<line x1="20" y1="70" x2="80" y2="70" stroke="#2E7D32" stroke-width="1" stroke-dasharray="4,2" />
<text x="50" y="45" font-family="Arial, sans-serif" font-size="24" font-weight="bold" fill="#2E7D32"
text-anchor="middle">空闲</text>
<text x="50" y="85" font-family="Arial, sans-serif" font-size="12" fill="#2E7D32"
text-anchor="middle">{{ switchCellType(item.cellType) }}</text>
</svg>
<div class="cell-info">
<!-- <div class="cell-no">格口号: {{ item.cellNo }}</div> -->
<div class="price">价格: {{ item.price }}</div>
<div class="stock">库存: {{ item.stock }}</div>
<!-- <div class="cell-type">类型: {{ switchCellType(item.cellType) }}</div> -->
</div>
<!-- <div class="goods-name">{{ item.goodsId ? item.goodsName : '未配置商品' }}</div> -->
</div>
<div class="line-num">
<el-divider direction="horizontal" class="vertical-divider" />
<span class="line-number">{{ item.cellNo }}</span>
</div>
<div class="action-buttons">
<el-button v-if="!item.goodsId" link type="success"
@click="handleConfigure(item)" class="cell-btn">
商品配置
</el-button>
<el-button v-if="item.goodsId" link type="primary"
@click="handleEditCell(item)" class="cell-btn">
{{ item.goodsName }}
</el-button>
<!-- <el-button v-if="item.goodsId" type="warning" link :icon="useRenderIcon(EditPen)"
@click="handleStockConfig(item)">
库存
</el-button>
<el-button v-if="item.goodsId" type="danger" link :icon="useRenderIcon(Delete)"
@click="handleClearGoods(item)">
下架
</el-button> -->
</div>
</el-card>
</el-col>
</el-row>
<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="针脚号" prop="pinNo" width="80" />
<el-table-column label="商品图片" width="120">
<template #default="{ row }">
<el-image :src="row.coverImg" :preview-src-list="[row.coverImg]" :preview-teleported="true"
:hide-on-click-modal="true" 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 v-if="cabinetInfo.belongType === 0" type="success" link :icon="useRenderIcon(AddFill)"
@click="handleConfigure(row)">
配置商品
</el-button>
<el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEditCell(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="[12, 18, 24, 30, 36, 42]" layout="total, sizes, prev, pager, next, jumper"
: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>
@ -429,22 +421,21 @@ onMounted(() => {
<ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
<MainCabinetConfigModal v-model="mainCabinetConfigVisible" :cabinet-id="cabinetId"
@refresh="fetchCabinetDetail" />
<el-drawer v-model="editCabinetDrawerVisible" title="编辑柜体" size="30%" direction="rtl">
<el-drawer v-model="editCabinetDrawerVisible"
title="编辑柜体" size="30%" direction="rtl">
<EditCabinetDrawer v-model="editCabinetDrawerVisible" :cabinet-info="cabinetInfo"
@refresh="fetchCabinetDetail" />
</el-drawer>
<el-drawer v-model="goodsConfigVisible" title="配置商品" size="50%" direction="rtl">
<CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" :belong-type="shopInfo.mode == 4 ? 1 : 0" @refresh="fetchCellList" />
<el-drawer v-model="goodsConfigVisible" title="配置商品"
size="50%" direction="rtl">
<CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" @refresh="fetchCellList" />
</el-drawer>
<el-drawer v-model="configuredGoodsVisible" title="管理商品" size="30%" direction="rtl">
<ConfiguredGoodsModal v-model="configuredGoodsVisible" :cell-id="currentCell?.cellId"
:goods-id="currentCell?.goodsId" :goods-name="currentCell?.goodsName" :current-stock="currentCell?.stock"
:cover-img="currentCell?.coverImg" :price="currentCell?.price" @refresh="fetchCellList" />
</el-drawer>
<el-drawer v-model="cellFormVisible" title="新增格口" size="30%" direction="rtl">
<el-drawer v-model="cellFormVisible" title="新增格口"
size="30%" direction="rtl">
<CellFormModal v-model="cellFormVisible" :initial-cabinet-id="cabinetId" @refresh="fetchCellList" />
</el-drawer>
<el-drawer v-model="cellEditVisible" title="编辑格口" size="30%" direction="rtl">
<el-drawer v-model="cellEditVisible" title="编辑格口"
size="30%" direction="rtl">
<CellEditModal v-model="cellEditVisible" :row="currentCell" @refresh="fetchCellList" />
</el-drawer>
</div>
@ -452,82 +443,6 @@ onMounted(() => {
</template>
<style scoped lang="scss">
.cell-card {
margin-bottom: 12px;
display: flex;
flex-direction: column;
transition: all 0.3s ease;
/* &:hover {
transform: translateY(-3px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
} */
.card-content {
display: flex;
flex-direction: row;
margin: 0px;
.cell-image {
width: 50%;
height: 130px;
object-fit: contain;
border-radius: 4px;
margin-bottom: 12px;
}
.cell-info {
padding: 18px 8px 0 8px;
div {
font-size: 13px;
margin-bottom: 6px;
color: #606266;
&.goods-name {
font-weight: 500;
color: var(--el-text-color-primary);
}
&.price {
font-weight: 600;
}
}
}
}
.line-num {
display: flex;
justify-content: space-between;
align-items: center;
.vertical-divider {
margin: 0 0 0 0;
width: 85%;
}
.line-number {
font-size: 14px;
color: #606266;
font-weight: 600;
}
}
.action-buttons {
display: flex;
justify-content: center;
margin-top: auto;
padding: 8px 0 0 0;
/* border-top: 1px solid var(--el-border-color-light); */
.cell-btn {
margin-right: 8px;
width: 80px;
height: 30px;
}
}
}
:deep(.el-tabs__header) {
margin-bottom: 8px;
}
@ -543,7 +458,6 @@ onMounted(() => {
.el-form-item {
margin-bottom: 8px;
}
.detail-container {
display: flex;
flex-direction: column;
@ -575,7 +489,7 @@ onMounted(() => {
.cabinet-image {
width: 100%;
height: 320px;
height: 420px;
object-fit: contain;
margin-bottom: 15px;
}
@ -590,7 +504,6 @@ onMounted(() => {
margin-bottom: 0px;
}
}
.pagination {
margin-top: 10px;
}

34
src/views/cabinet/smart-cabinet-card/edit-cabinet-drawer.vue
View File

@ -27,9 +27,7 @@ const formData = reactive({
templateNo: "",
lockControlNo: 0,
location: 0,
belongType: 0,
mode: 0,
balanceEnable: 1
belongType: 0
});
const rules = reactive<FormRules>({
@ -45,12 +43,6 @@ const rules = reactive<FormRules>({
],
belongType: [
{ required: true, message: "请选择归属类型", trigger: "change" }
],
mode: [
{ required: true, message: "请选择运行模式", trigger: "change" }
],
balanceEnable: [
{ required: true, message: "请选择借呗支付状态", trigger: "change" }
]
});
@ -104,26 +96,10 @@ watch(() => props.cabinetInfo, (newVal) => {
</el-select>
</el-form-item>
<!-- <el-form-item label="商品模式" prop="belongType">
<el-select v-model="formData.belongType" placeholder="请选择商品模式">
<el-option label="借还模式" :value="0" />
<el-option label="固资模式" :value="1" />
</el-select>
</el-form-item> -->
<!-- <el-form-item label="运行模式" prop="mode">
<el-select v-model="formData.mode" placeholder="请选择运行模式">
<el-option label="支付模式" :value="0" />
<el-option label="审批模式" :value="1" />
<el-option label="借还模式" :value="2" />
<el-option label="会员模式" :value="3" />
</el-select>
</el-form-item> -->
<!-- <el-form-item label="借呗支付" prop="balanceEnable">
<el-select v-model="formData.balanceEnable" placeholder="请选择借呗支付状态">
<el-option label="正常使用" :value="1" />
<el-option label="禁止使用" :value="0" />
<!-- <el-form-item label="归属类型" prop="belongType">
<el-select v-model="formData.belongType" placeholder="请选择归属类型">
<el-option label="借还柜" :value="0" />
<el-option label="固资通" :value="1" />
</el-select>
</el-form-item> -->

13
src/views/cabinet/smart-cabinet-card/index.vue
View File

@ -13,7 +13,6 @@ import View from "@iconify-icons/ep/view";
import AddFill from "@iconify-icons/ri/add-circle-line";
import SmartCabinetCardFormModal from "./smart-cabinet-card-form-modal.vue";
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
import { getModeText } from "@/api/shop/shop";
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
defineOptions({
@ -130,7 +129,9 @@ onMounted(() => {
<img :src="`${IMG_PATH}img/cabinet/${CabinetImgMap[item.templateNo]?.img || 'default.jpg'}`"
class="cabinet-image" />
<el-descriptions class="cabinet-info" :column="1">
<el-descriptions-item class="name">模式：{{ getModeText(item.mode) }}
<el-descriptions-item class="name">名称：{{ item.cabinetName }}
</el-descriptions-item>
<el-descriptions-item class="name">模式：{{ '支付模式' }}
</el-descriptions-item>
<!-- <div class="type">柜体类型：{{ item.cabinetType === 0 ? '主柜' : '副柜' }}</div> -->
<el-descriptions-item class="template">格式：{{ CabinetImgMap[item.templateNo]?.name || '-' }}
@ -144,9 +145,7 @@ onMounted(() => {
</el-descriptions>
</div>
<el-divider class="divider" />
<el-button class="detail-btn" link @click="handleViewDetail(item)">
{{ item.cabinetName }}
</el-button>
<el-button class="detail-btn" :icon="useRenderIcon(View)" @click="handleViewDetail(item)" />
</el-card>
</el-col>
</el-row>
@ -230,10 +229,6 @@ onMounted(() => {
border: 0;
margin-top: auto;
padding: 8px 0;
&:hover {
color: var(--el-color-primary);
}
}
}

44
src/views/cabinet/smart-cabinet-card/smart-cabinet-card-form-modal.vue
View File

@ -14,8 +14,6 @@ export interface FormDTO {
lockControlNo: number;
location: number;
belongType: number;
mode: number;
balanceEnable: number;
}
const props = defineProps({
@ -30,17 +28,15 @@ const emit = defineEmits(["update:modelValue", "refresh"]);
const formRef = ref();
const formData = reactive<FormDTO>({
cabinetName: "",
cabinetType: 0,
cabinetType: 1,
templateNo: "",
lockControlNo: 0,
location: 0,
belongType: 0,
mode: 0,
balanceEnable: 1
belongType: 0
});
const rules = reactive<FormRules>({
cabinetName: [{ required: true, max:4, message: "柜体名称必填", trigger: "blur" }],
cabinetName: [{ required: true, message: "柜体名称必填", trigger: "blur" }],
cabinetType: [{ required: true, message: "请选择柜体类型", trigger: "change" }],
templateNo: [{ required: true, message: "请选择模板编号", trigger: "change" }],
lockControlNo: [
@ -52,12 +48,6 @@ const rules = reactive<FormRules>({
],
belongType: [
{ required: true, message: "请选择归属类型", trigger: "change" }
],
mode: [
{ required: true, message: "请选择运行模式", trigger: "change" }
],
balanceEnable: [
{ required: true, message: "请选择借呗支付状态", trigger: "change" }
]
});
@ -90,12 +80,12 @@ const templateOptions = Object.entries(CabinetImgMap).map(([value, item]) => ({
<el-input v-model="formData.cabinetName" placeholder="请输入柜体名称" />
</el-form-item>
<!-- <el-form-item label="柜体类型" prop="cabinetType">
<el-form-item label="柜体类型" prop="cabinetType">
<el-select v-model="formData.cabinetType" placeholder="请选择类型">
<el-option label="主柜" :value="0" />
<el-option label="副柜" :value="1" />
</el-select>
</el-form-item> -->
</el-form-item>
<el-form-item label="模板编号" prop="templateNo">
<el-select v-model="formData.templateNo" placeholder="请选择模板编号">
@ -103,26 +93,10 @@ const templateOptions = Object.entries(CabinetImgMap).map(([value, item]) => ({
</el-select>
</el-form-item>
<!-- <el-form-item label="商品模式" prop="belongType">
<el-select v-model="formData.belongType" placeholder="请选择商品模式">
<el-option label="借还模式" :value="0" />
<el-option label="固资模式" :value="1" />
</el-select>
</el-form-item> -->
<!-- <el-form-item label="运行模式" prop="mode">
<el-select v-model="formData.mode" placeholder="请选择运行模式">
<el-option label="支付模式" :value="0" />
<el-option label="审批模式" :value="1" />
<el-option label="借还模式" :value="2" />
<el-option label="会员模式" :value="3" />
</el-select>
</el-form-item> -->
<!-- <el-form-item label="借呗支付" prop="balanceEnable">
<el-select v-model="formData.balanceEnable" placeholder="请选择借呗支付状态">
<el-option label="正常使用" :value="1" />
<el-option label="禁止使用" :value="0" />
<!-- <el-form-item label="归属类型" prop="belongType">
<el-select v-model="formData.belongType" placeholder="请选择归属类型">
<el-option label="借还柜" :value="0" />
<el-option label="固资通" :value="1" />
</el-select>
</el-form-item> -->

10
src/views/cabinet/smart-cabinet/ShopConfigModal.vue
View File

@ -1,8 +1,8 @@
<template>
<el-dialog v-model="visible" title="地址配置" width="800px">
<el-dialog v-model="visible" title="商店配置" width="800px">
<el-table :data="shopList" v-loading="loading" border>
<el-table-column prop="shopId" label="地址ID" width="100" />
<el-table-column prop="shopName" label="地址名称" />
<el-table-column prop="shopId" label="商店ID" width="100" />
<el-table-column prop="shopName" label="商店名称" />
<el-table-column label="操作" width="80" fixed="right">
<template #default="{ row }">
<el-button link type="primary" @click="handleConfig(row)">配置</el-button>
@ -25,7 +25,6 @@ import { updateSmartCabinet } from '@/api/cabinet/smart-cabinet';
const props = defineProps<{
modelValue: boolean;
cabinetId: number;
// belongType?: number;
}>();
const emit = defineEmits(['update:modelValue', 'refresh']);
@ -48,8 +47,7 @@ const loadShops = async () => {
loading.value = true;
const { data } = await getShopList({
pageSize: pagination.value.pageSize,
pageNum: pagination.value.currentPage,
// belongType: props.belongType
pageNum: pagination.value.currentPage
});
shopList.value = data.rows;
pagination.value.total = data.total;

2
src/views/login/index.vue
View File

@ -103,7 +103,6 @@ const onLogin = async (formEl: FormInstance | undefined) => {
.then(({ data }) => {
// 登录成功后 将token存储到sessionStorage中
setTokenFromBackend(data);
wxStore.setQyUser(data.qyUser);
// 获取后端路由
initRouter().then(() => {
router.push(getTopMenu(true).path);
@ -133,7 +132,6 @@ const onLogin = async (formEl: FormInstance | undefined) => {
.then(({ data }) => {
// 登录成功后 将token存储到sessionStorage中
setTokenFromBackend(data);
wxStore.setQyUser(data.qyUser);
// 获取后端路由
initRouter().then(() => {
router.push(getTopMenu(true).path);

29
src/views/shop/cabinet-goods/cabinet-goods-config-modal.vue
View File

@ -6,16 +6,11 @@ import { configureGoodsCellsStock } from "@/api/cabinet/cabinet-cell";
import Search from "@iconify-icons/ep/search";
import Refresh from "@iconify-icons/ep/refresh";
import { ElMessage, ElMessageBox } from "element-plus";
import { useWxStore } from "@/store/modules/wx";
const props = defineProps({
cellId: {
type: Number,
required: true
},
belongType: {
type: Number,
required: false
}
});
@ -24,13 +19,9 @@ const closeModal = () => {
emit('update:modelValue', false);
};
const wxStore = useWxStore();
const searchFormParams = ref({
corpid: wxStore.corpid,
goodsName: "",
status: null,
belongType: props.belongType
status: null
});
const pagination = ref({
@ -45,8 +36,6 @@ const dataList = ref<GoodsDTO[]>([]);
const getList = async () => {
try {
loading.value = true;
searchFormParams.value.corpid = wxStore.corpid;
searchFormParams.value.belongType = props.belongType;
const { data } = await getGoodsListApi({
...searchFormParams.value,
pageSize: pagination.value.pageSize,
@ -104,23 +93,15 @@ defineExpose({ getList });
<template>
<div class="config-modal">
<el-form :inline="true" :model="searchFormParams" class="search-form">
<el-form-item>
<el-input @keydown.enter.prevent="getList" v-model="searchFormParams.goodsName" placeholder="请输入商品名称"
clearable />
<el-form-item label="商品名称：">
<el-input v-model="searchFormParams.goodsName" placeholder="请输入商品名称" clearable />
</el-form-item>
<!-- <el-form-item label="状态：">
<el-form-item label="状态：">
<el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable>
<el-option label="已上架" :value="1" />
<el-option label="已下架" :value="2" />
</el-select>
</el-form-item> -->
<!-- <el-form-item prop="belongType">
<el-select v-model="searchFormParams.belongType" placeholder="请选择商品所属" clearable @change="getList"
class="!w-[180px]">
<el-option label="智柜通" :value="0" />
<el-option label="固资通" :value="1" />
</el-select>
</el-form-item> -->
</el-form-item>
<el-form-item>
<el-button type="primary" :icon="useRenderIcon(Search)" @click="getList">
搜索

269
src/views/shop/goods/detail.vue
View File

@ -1,269 +0,0 @@
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import { useRoute, useRouter } from "vue-router";
import { getGoodsInfo, GoodsDTO } from "@/api/shop/goods";
import { getOrderListApi, type OrderDTO, OrderQuery } from "@/api/shop/order";
import { ElMessage } from "element-plus";
import { useRenderIcon } from '@/components/ReIcon/src/hooks';
import EditPen from '@iconify-icons/ep/edit-pen';
import GoodsEditModal from "./goods-edit-modal.vue";
const handleEdit = (row: GoodsDTO) => {
goodsInfo.value = row;
editModalVisible.value = true;
};
const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
defineOptions({
name: "GoodsDetail"
});
const router = useRouter();
const route = useRoute();
const goodsInfo = ref<GoodsDTO>({
goodsId: 0,
goodsName: "",
categoryId: 0,
price: 0,
stock: 0,
status: 0,
autoApproval: 0,
coverImg: "",
goodsDetail: "",
belongType: 0,
corpid: ""
});
const loading = ref(false);
const activeTab = ref('basic');
const goodsId = ref<number>(0);
const editModalVisible = ref(false);
async function fetchGoodsDetail() {
try {
loading.value = true;
const { data } = await getGoodsInfo(goodsId.value);
goodsInfo.value = data;
} finally {
loading.value = false;
}
}
onMounted(() => {
goodsId.value = Number(route.query.id);
fetchGoodsDetail();
});
const orderList = ref<OrderDTO[]>([]);
const orderLoading = ref(false);
const orderPagination = ref({
pageSize: 8,
currentPage: 1,
total: 0
});
const fetchOrderList = async () => {
try {
orderLoading.value = true;
const { data } = await getOrderListApi({
goodsId: goodsId.value,
pageSize: orderPagination.value.pageSize,
pageNum: orderPagination.value.currentPage
});
orderList.value = data.rows;
orderPagination.value.total = data.total;
} finally {
orderLoading.value = false;
}
};
const onOrderSizeChange = (val: number) => {
orderPagination.value.pageSize = val;
fetchOrderList();
};
const onOrderCurrentChange = (val: number) => {
orderPagination.value.currentPage = val;
fetchOrderList();
};
watch(goodsId, () => {
fetchOrderList();
}, { immediate: true });
</script>
<template>
<div class="detail-container">
<goods-edit-modal v-model:visible="editModalVisible" :row="goodsInfo" @refresh="fetchGoodsDetail" />
<div class="flex-container">
<el-card class="goods-info-card">
<div class="goods-header">
<img :src="goodsInfo.coverImg" class="goods-image" />
<div class="goods-name">{{ goodsInfo.goodsName }}</div>
</div>
<el-divider />
<el-descriptions class="goods-details" :column="1" border>
<el-descriptions-item label="名称">{{ goodsInfo.goodsName }}</el-descriptions-item>
<el-descriptions-item label="价格">{{ goodsInfo.price }}</el-descriptions-item>
<el-descriptions-item label="库存">{{ goodsInfo.stock }}</el-descriptions-item>
<el-descriptions-item label="状态">{{ goodsInfo.status === 1 ? '已上架' : '已下架' }}</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="info-card">
<div class="tab-header">
<el-tabs type="card" v-model="activeTab" class="tab-header-card">
<el-tab-pane label="基本信息" name="basic"></el-tab-pane>
<el-tab-pane label="购买记录" name="order"></el-tab-pane>
</el-tabs>
<el-button v-if="goodsInfo.belongType == 0" type="primary" @click="handleEdit(goodsInfo)"
style="margin-bottom: 12px" :size="'default'">
编辑商品
</el-button>
</div>
<div class="info-details" v-if="activeTab === 'basic'">
<el-descriptions :column="2" border>
<el-descriptions-item label="名称">{{ goodsInfo.goodsName }}</el-descriptions-item>
<el-descriptions-item label="价格">{{ goodsInfo.price }}</el-descriptions-item>
<el-descriptions-item label="库存">{{ goodsInfo.stock }}</el-descriptions-item>
<el-descriptions-item label="已分配库存">{{ goodsInfo.totalStock }}</el-descriptions-item>
<el-descriptions-item label="状态">{{ goodsInfo.status === 1 ? '已上架' : '已下架' }}</el-descriptions-item>
<el-descriptions-item label="自动审批">{{ goodsInfo.autoApproval === 1 ? '开启' : '关闭' }}</el-descriptions-item>
<el-descriptions-item label="商品描述" :span="2">
<div v-html="goodsInfo.goodsDetail"></div>
</el-descriptions-item>
<el-descriptions-item label="关联状态" :span="2">
{{ goodsInfo.cellNoStr ? '已上柜' : '未上柜' }}
</el-descriptions-item>
<el-descriptions-item label="关联柜址">{{ goodsInfo.shopNameStr }}</el-descriptions-item>
<el-descriptions-item label="柜体名称">{{ goodsInfo.cabinetName }}</el-descriptions-item>
<el-descriptions-item label="柜体格号">{{ goodsInfo.cellNoStr }}</el-descriptions-item>
</el-descriptions>
</div>
<div class="order-details" v-if="activeTab === 'order'">
<el-table v-loading="orderLoading" :data="orderList" row-key="orderId" border>
<el-table-column label="订单ID" prop="orderId" width="120" />
<el-table-column label="商品名称" prop="goodsNames">
<template #default="{ row }">
<span v-if="row.goodsNames">
{{ row.goodsNames.split(',').join(', ') }}
</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="姓名" prop="name" width="120" />
<el-table-column label="手机号" prop="mobile" width="120" />
<el-table-column label="订单金额" prop="totalAmount" width="120">
<template #default="{ row }">{{ row.totalAmount }}元</template>
</el-table-column>
<el-table-column label="订单状态" prop="status" width="120">
<template #default="{ row }">
<el-tag :type="row.status === 2 ? 'success' : row.status === 5 ? 'danger' : 'info'">
{{ { 1: '待付款', 2: '已付款', 3: '已发货', 4: '已完成', 5: '已取消' }[row.status] }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="支付状态" prop="payStatus" width="120">
<template #default="{ row }">
<el-tag :type="row.payStatus === 2 ? 'success' : 'info'">
{{ { 1: '未支付', 2: '已支付', 3: '退款中', 4: '已退款' }[row.payStatus] }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="支付方式" prop="paymentMethod" width="120">
<template #default="{ row }">
{{ { wechat: '微信支付', balance: '余额支付' }[row.paymentMethod] || row.paymentMethod }}
</template>
</el-table-column>
<el-table-column label="支付时间" prop="payTime" width="180">
<template #default="{ row }">
{{ row.payTime ? new Date(row.payTime).toLocaleString() : '-' }}
</template>
</el-table-column>
</el-table>
<el-pagination v-model:current-page="orderPagination.currentPage" v-model:page-size="orderPagination.pageSize"
:page-sizes="[8, 10, 20, 50]" layout="total, sizes, prev, pager, next, jumper"
:total="orderPagination.total" @size-change="onOrderSizeChange" @current-change="onOrderCurrentChange"
class="pagination" />
</div>
<div class="sales-details" v-if="activeTab === 'sales'">
<!-- 销售记录表格 -->
</div>
</el-card>
</div>
</div>
</template>
<style scoped lang="scss">
.detail-container {
display: flex;
flex-direction: column;
height: 100%;
.flex-container {
display: flex;
flex: 1;
gap: 12px;
min-height: 0;
.goods-info-card {
width: 20%;
height: 88vh;
}
.info-card {
width: 80%;
height: 88vh;
overflow-y: auto;
}
}
.goods-header {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 20px;
.goods-image {
width: 100%;
height: 320px;
object-fit: contain;
margin-bottom: 15px;
}
.goods-name {
font-size: 20px;
font-weight: bold;
}
}
.tab-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0px;
.tab-header-card {
flex: 1;
margin-right: 10px;
}
}
}
.order-details {
margin-top: 8px;
background-color: var(--el-bg-color);
border-radius: 4px;
padding: 16px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
.pagination {
margin-top: 10px;
}
}
</style>

6
src/views/shop/goods/goods-edit-modal.vue
View File

@ -84,7 +84,6 @@ const initForm = async () => {
categoryOptions.value = data;
// 初始化表单数据
console.log("初始化表单数据", props.row);
if (props.row?.goodsId) {
isEdit.value = true;
Object.assign(formData, props.row);
@ -161,12 +160,12 @@ const handleDelete = async () => {
<el-input-number v-model="formData.stock" :min="0" controls-position="right" />
</el-form-item>
<!-- <el-form-item label="商品分类" prop="categoryId">
<el-form-item label="商品分类" prop="categoryId">
<el-select v-model="formData.categoryId" placeholder="请选择商品分类" clearable class="w-full">
<el-option v-for="category in categoryOptions" :key="category.categoryId" :label="category.categoryName"
:value="category.categoryId" />
</el-select>
</el-form-item> -->
</el-form-item>
<el-form-item label="自动审批" prop="autoApproval">
<el-switch v-model="formData.autoApproval" :active-value="1" :inactive-value="0" active-text="启用"
@ -193,6 +192,7 @@ const handleDelete = async () => {
</el-form>
<template #footer>
<el-button @click="closeDialog">取消</el-button>
<el-button type="primary" :icon="useRenderIcon(Confirm)" @click="handleConfirm">
确认
</el-button>

31
src/views/shop/goods/goods-form-modal.vue
View File

@ -6,7 +6,6 @@ import { addGoodsApi, GoodsDTO } from "@/api/shop/goods";
import { CategoryDTO, getCategoryAllApi } from "@/api/shop/category";
import Confirm from "@iconify-icons/ep/check";
import Upload from "@iconify-icons/ep/upload";
import { useWxStore } from "@/store/modules/wx";
const { VITE_APP_BASE_API } = import.meta.env;
const props = defineProps({
@ -18,7 +17,6 @@ const props = defineProps({
const emit = defineEmits(["update:visible", "refresh"]);
const wxStore = useWxStore();
const formRef = ref();
const formData = reactive<GoodsDTO>({
goodsName: "",
@ -29,9 +27,7 @@ const formData = reactive<GoodsDTO>({
categoryId: 0,
goodsDetail: "",
coverImg: "",
usageInstruction: "",
belongType: 0,
corpid: wxStore.corpid
usageInstruction: ""
});
const rules = reactive<FormRules>({
@ -52,7 +48,6 @@ const rules = reactive<FormRules>({
const handleConfirm = async () => {
try {
await formRef.value.validate();
formData.corpid = wxStore.corpid;
await addGoodsApi(formData);
ElMessage.success("商品添加成功");
emit("refresh");
@ -101,7 +96,7 @@ const beforeAvatarUpload = (rawFile) => {
</script>
<template>
<el-drawer :title="'新增商品'" :model-value="visible" size="50%" direction="rtl" @close="closeDialog">
<el-dialog title="新增商品" :model-value="visible" width="600px" @close="closeDialog" @open="loadCategories">
<el-form ref="formRef" :model="formData" :rules="rules" label-width="80px" label-position="right">
<el-form-item label="商品名称" prop="goodsName">
<el-input v-model="formData.goodsName" placeholder="请输入商品名称" clearable />
@ -123,12 +118,12 @@ const beforeAvatarUpload = (rawFile) => {
</el-form-item>
<!-- 在状态表单项前添加分类选择 -->
<!-- <el-form-item label="商品分类" prop="categoryId">
<el-form-item label="商品分类" prop="categoryId">
<el-select v-model="formData.categoryId" placeholder="请选择商品分类" clearable class="w-full">
<el-option v-for="category in categoryOptions" :key="category.categoryId" :label="category.categoryName"
:value="category.categoryId" />
</el-select>
</el-form-item> -->
</el-form-item>
<el-form-item label="自动审批" prop="autoApproval">
<el-switch v-model="formData.autoApproval" :active-value="1" :inactive-value="0" active-text="启用"
@ -147,23 +142,15 @@ const beforeAvatarUpload = (rawFile) => {
</el-form>
<template #footer>
<div class="drawer-footer">
<el-button type="primary" :icon="useRenderIcon(Confirm)" @click="handleConfirm">
确认
</el-button>
</div>
<el-button @click="closeDialog">取消</el-button>
<el-button type="primary" :icon="useRenderIcon(Confirm)" @click="handleConfirm">
确认
</el-button>
</template>
</el-drawer>
</el-dialog>
</template>
<style scoped>
.drawer-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
padding: 16px;
}
.avatar-uploader {
:deep(.el-upload) {
border: 1px dashed var(--el-border-color);

206
src/views/shop/goods/index.vue
View File

@ -9,36 +9,28 @@ import AddFill from "@iconify-icons/ri/add-circle-line";
import Search from "@iconify-icons/ep/search";
import Refresh from "@iconify-icons/ep/refresh";
import Setting from "@iconify-icons/ep/setting";
import View from "@iconify-icons/ep/view";
import GoodsFormModal from "./goods-form-modal.vue";
import GoodsEditModal from "./goods-edit-modal.vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { deleteGoodsApi } from "@/api/shop/goods";
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
import { useRouter } from "vue-router";
import { useWxStore } from "@/store/modules/wx";
defineOptions({
name: "ShopGoods"
});
const wxStore = useWxStore();
const router = useRouter();
const formRef = ref();
const tableRef = ref();
const modalVisible = ref(false);
// 搜索表单
const searchFormParams = ref({
corpid: wxStore.corpid,
belongType: null,
goodsName: "",
status: null
});
// 分页参数
const pagination = ref({
pageSize: 12,
pageSize: 6,
currentPage: 1,
total: 0
});
@ -55,7 +47,6 @@ const getList = async () => {
loading.value = true;
const { data } = await getGoodsListApi({
...searchFormParams.value,
corpid: wxStore.corpid,
pageSize: pagination.value.pageSize,
pageNum: pagination.value.currentPage
});
@ -134,25 +125,6 @@ const handleEdit = (row: GoodsDTO) => {
editVisible.value = true;
};
const handleViewDetail = (row: GoodsDTO) => {
// 保存信息到标签页
useMultiTagsStoreHook().handleTags("push", {
path: `/shop/goods/detail`,
name: "GoodsDetail",
query: { id: row.goodsId },
meta: {
title: `${row.goodsName}`,
dynamicLevel: 3
}
});
router.push({
path: '/shop/goods/detail',
query: {
id: row.goodsId
}
});
};
</script>
<template>
@ -163,13 +135,6 @@ const handleViewDetail = (row: GoodsDTO) => {
<el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.goodsName" placeholder="请输入商品名称" clearable
class="!w-[200px]" />
</el-form-item>
<el-form-item prop="belongType">
<el-select v-model="searchFormParams.belongType" placeholder="请选择商品所属" clearable @change="onSearch"
class="!w-[180px]">
<el-option label="智柜通" :value="0" />
<el-option label="固资通" :value="1" />
</el-select>
</el-form-item>
<!-- <el-form-item label="状态：" prop="status">
<el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable class="!w-[180px]">
<el-option label="已上架" :value="1" />
@ -191,27 +156,60 @@ const handleViewDetail = (row: GoodsDTO) => {
</el-form-item>
</el-form>
<div class="grid-container">
<el-row :gutter="12">
<el-col v-for="(item, index) in dataList" :key="item.goodsId" :xs="24" :sm="12" :md="8" :lg="4" :xl="4">
<el-card class="goods-card" :body-style="{ padding: '8px 10px' }">
<div class="card-content">
<el-image :src="item.coverImg" :preview-src-list="[item.coverImg]" class="goods-image" fit="contain" />
<div class="goods-info">
<div class="price">价格：{{ item.price }}</div>
<div class="stock">库存：{{ item.stock }}</div>
<div class="info-item">状态：{{ item.status === 1 ? '已上架' : '已下架' }}</div>
</div>
</div>
<div class="detail-btn" @click="handleViewDetail(item)">
{{ item.goodsName }}
</div>
</el-card>
</el-col>
</el-row>
<div class="table-container">
<el-table ref="tableRef" v-loading="loading" :data="dataList" row-key="id"
@selection-change="handleSelectionChange" border>
<el-table-column type="selection" width="55" />
<el-table-column label="商品图片" width="120">
<template #default="{ row }">
<el-image :src="row.coverImg" :preview-src-list="[row.coverImg]" :z-index="9999" :preview-teleported="true"
:hide-on-click-modal="true" fit="cover" class="rounded" width="60" height="60" />
</template>
</el-table-column>
<el-table-column label="商品名称" prop="goodsName" />
<el-table-column label="价格" prop="price" width="120" />
<el-table-column label="库存" prop="stock" width="120" />
<el-table-column label="状态" prop="status" width="120">
<template #default="{ row }">
<el-tag :type="row.status === 1 ? 'success' : 'danger'">
{{ row.status === 1 ? '已上架' : '已下架' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="自动审批" prop="autoApproval" width="120">
<template #default="{ row }">
<el-tag :type="row.autoApproval === 1 ? 'success' : 'info'">
{{ row.autoApproval === 1 ? '启用' : '关闭' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="柜口" prop="cellNo" width="120">
<template #default="{ row }">
{{ !row.cellNoStr ? '未配置' : row.cabinetName + ' 格口' + row.cellNoStr }}
</template>
</el-table-column>
<el-table-column label="操作" width="150" fixed="right">
<template #default="{ row }">
<el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEdit(row)" class="right-btn">
编辑
</el-button>
<!-- <el-button type="warning" link :icon="useRenderIcon(Setting)" class="right-btn"
@click="currentRow = row; configVisible = true">
配置格口
</el-button> -->
<!-- <el-popconfirm :title="`确认删除【${row.goodsName}】？`" @confirm="handleDelete(row)">
<template #reference>
<el-button type="danger" link :icon="useRenderIcon(Delete)" class="right-btn">
删除
</el-button>
</template>
</el-popconfirm> -->
</template>
</el-table-column>
</el-table>
<el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
:page-sizes="[12, 18, 24, 30, 36, 42]" layout="total, sizes, prev, pager, next, jumper"
:total="pagination.total" @size-change="onSizeChange" @current-change="onCurrentChange" class="pagination" />
:page-sizes="[6, 10, 20, 50]" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
@size-change="onSizeChange" @current-change="onCurrentChange" class="pagination" />
</div>
<!-- 新增商品弹窗 -->
<goods-form-modal v-model:visible="modalVisible" @refresh="getList" />
@ -228,7 +226,6 @@ const handleViewDetail = (row: GoodsDTO) => {
opacity: 1;
background-color: rgba(0, 0, 0, 0.8);
}
.search-form {
:deep(.el-form-item) {
margin-bottom: 12px;
@ -240,97 +237,26 @@ const handleViewDetail = (row: GoodsDTO) => {
flex: 1;
width: 100%;
}
.pagination {
margin-top: 10px;
text-align: center;
:deep(.el-pagination) {
margin: 0;
padding: 4px 0;
}
.right-btn {
margin: 0;
}
.goods-card {
margin-bottom: 12px;
min-height: 210px;
display: flex;
flex-direction: column;
justify-content: space-between;
transition: all 0.3s ease;
/* &:hover {
transform: translateY(-3px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
} */
}
.card-content {
display: flex;
flex-direction: row;
margin: 0px;
.goods-image {
width: 55%;
height: 180px;
object-fit: contain;
border-radius: 4px;
margin-right: 10px;
}
.goods-info {
flex: 1;
padding: 16px 0 0 0;
.name,
.info-item,
.price,
.stock {
font-size: 14px;
font-weight: 500;
margin-bottom: 6px;
color: #606266;
}
/* .price,
.info-item,
.stock {
color: #909399;
} */
}
}
.divider {
margin: 5px 0px;
}
.detail-btn {
&:hover {
background-color: var(--el-color-primary-light-9);
color: var(--el-color-primary);
transition: all 0.3s ease;
}
width: 100%;
margin-top: auto;
padding: 4px 0;
text-align: center;
color: #409eff;
font-weight: 500;
cursor: pointer;
}
.grid-container {
.table-container {
margin-top: 8px;
background-color: var(--el-bg-color);
border-radius: 4px;
padding: 16px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
margin-bottom: 12px;
min-height: 300px;
display: flex;
flex-direction: column;
.el-row {
margin-bottom: -12px;
.el-table {
flex: 1;
overflow: hidden;
}
.pagination {
margin-top: 10px;
}
}
</style>

12
src/views/system/role/index.vue
View File

@ -216,17 +216,7 @@ onSearch().then(() => {
statusList[item].label }}</el-radio>
</el-radio-group>
</el-form-item> -->
<el-form-item prop="menuIds" class="form-input">
<template #label>
<div class="menu-label">
<span>菜单权限</span>
<!-- <el-checkbox-group v-model="formData.menuIds" class="checkbox-group">
<el-checkbox v-model="formData.menuIds" label="all" class="menu-checkbox">
全部
</el-checkbox>
</el-checkbox-group> -->
</div>
</template>
<el-form-item label="菜单权限" prop="menuIds" class="form-input">
<el-checkbox-group v-model="formData.menuIds" class="checkbox-group">
<template v-for="menu in processedMenuOptions" :key="menu.categoryName">
<span class="menu-category">{{ menu.categoryName }}：</span>

2
src/views/user/qy/index.vue
View File

@ -257,7 +257,7 @@ watch(
.pagination-wrapper {
position: relative;
background: var(--el-bg-color);
padding: 12px 12px 13px 12px;
padding: 8px 12px;
margin-top: 20px;
text-align: center;

49
src/views/welcome/index.vue
View File

@ -2,16 +2,11 @@
import { Goods, Shop, Document, Money } from '@element-plus/icons-vue';
import { getStats, TodayLatestOrderGoodsDTO, TopGoodsDTO } from '@/api/shop/stats';
import { markRaw, onMounted, ref } from 'vue';
import { useWxStore } from '@/store/modules/wx';
import { ElDialog, ElForm, ElFormItem, ElInput, ElMessage } from 'element-plus';
import { bindQyUserApi } from '@/api/ab98/user';
defineOptions({
name: "Welcome"
});
const wxStore = useWxStore();
const shopData = ref<{
name: string;
icon: any; // 假设这里是 Element Plus 的图标组件
@ -37,31 +32,6 @@ const topGoods = ref<TopGoodsDTO[]>([]);
const todayLatestOrderGoods = ref<TodayLatestOrderGoodsDTO[]>([]);
const maxOccurrenceCount = ref(0);
const showDialog = ref(false);
const form = ref({ name: '', idCard: '' });
const rules = {
name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
idCard: [
{ required: true, message: '请输入身份证号', trigger: 'blur' },
{ pattern: /^\d{17}[\dXx]$/, message: '身份证格式不正确', trigger: 'blur' }
]
};
const handleSubmit = async () => {
try {
const { data } = await bindQyUserApi({
qyUserId: wxStore.qyUser?.id,
name: form.value.name,
idNum: form.value.idCard
});
ElMessage.success('绑定成功');
showDialog.value = false;
} catch (error) {
ElMessage.error(error.message || '绑定失败');
}
};
onMounted(async () => {
try {
const { data } = await getStats();
@ -89,11 +59,6 @@ onMounted(async () => {
} catch (error) {
console.error('获取统计数据失败:', error);
}
if (wxStore.qyUser && !wxStore.qyUser.ab98UserId) {
showDialog.value = true;
}
});
</script>
@ -222,20 +187,6 @@ onMounted(async () => {
</div>
</el-col>
</el-row>
<el-dialog v-model="showDialog" title="请绑定汇邦云账号" :close-on-click-modal="false" width="30%">
<el-form :model="form" :rules="rules" label-width="80px">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" maxlength="18" show-word-limit />
</el-form-item>
</el-form>
<template #footer>
<el-button type="primary" @click="handleSubmit">提交</el-button>
</template>
</el-dialog>
</div>
</template>