Merge branch 'main' of http://47.109.205.240:3000/Web/operation-system
This commit is contained in:
commit
ed6dcdeaef
41
src/api/brand/index.js
Normal file
41
src/api/brand/index.js
Normal file
@ -0,0 +1,41 @@
|
||||
import request from "@/utils/request";
|
||||
|
||||
// 获取商品管理列表
|
||||
export function getBrandbaseList(query) {
|
||||
return request({
|
||||
url: "/brand/brandbase/page",
|
||||
method: "get",
|
||||
params: query,
|
||||
});
|
||||
}
|
||||
//新增品牌
|
||||
export function addBrand(data) {
|
||||
return request({
|
||||
url: "/brand/brandbase/save",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//编辑品牌
|
||||
export function updateBrand(data) {
|
||||
return request({
|
||||
url: "/brand/brandbase/update",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
// 删除品牌
|
||||
export function deleteBrand(id) {
|
||||
return request({
|
||||
url: `/brand/brandbase/del/${id}`,
|
||||
method: "delete",
|
||||
});
|
||||
}
|
||||
|
||||
// 获取品牌信息(id)
|
||||
export function getBrandInfo(id) {
|
||||
return request({
|
||||
url: `/brand/brandbase/detail/${id}`,
|
||||
method: "get",
|
||||
});
|
||||
}
|
@ -93,12 +93,6 @@ export const constantRoutes = [
|
||||
name: 'editGoods',
|
||||
meta: { title: '编辑商品', icon: '' }
|
||||
},
|
||||
{
|
||||
path: 'goodsManage/seeDetails/:activeTab?',
|
||||
component: () => import('@/views/goods/goodsManage/seeDetails'),
|
||||
name: 'seeDetails',
|
||||
meta: { title: '商品详情', icon: '' }
|
||||
},
|
||||
{
|
||||
path: '/goods/goodsReview/auditGoods/:activeTab?',
|
||||
component: () => import('@/views/goods/goodsReview/auditGoods'),
|
||||
@ -107,35 +101,7 @@ export const constantRoutes = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/order',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
redirect: 'noredirect',
|
||||
children: [
|
||||
{
|
||||
path: 'order/sendGoodsInfo/:activeTab?',
|
||||
component: () => import('@/views/order/sendGoodsInfo'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "去发货",
|
||||
icon: "star",
|
||||
},
|
||||
name: "sendGoodsInfo",
|
||||
},
|
||||
{
|
||||
path: 'order/orderDetails/:activeTab?',
|
||||
component: () => import('@/views/order/orderDetails'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "订单详情",
|
||||
icon: "star",
|
||||
},
|
||||
name: "orderDetails",
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
@ -362,122 +328,63 @@ export const constantRoutes = [
|
||||
name: "brand",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
children: [
|
||||
{
|
||||
path: 'brand/index',
|
||||
component: () => import('@/views/brand/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "公共品牌",
|
||||
icon: "star",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "index",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/order',
|
||||
name: "order",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
alwaysShow: true,
|
||||
redirect: 'noredirect',
|
||||
meta: {
|
||||
title: "订单列表",
|
||||
icon: "documentation",
|
||||
noCache: false,
|
||||
icon: "money",
|
||||
link: null,
|
||||
noCache: false,
|
||||
title: "公共品牌",
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'order/obligation',
|
||||
component: () => import('@/views/order/obligation'),
|
||||
path: 'brand/informationManagement',
|
||||
component: () => import('@/views/brand/informationManagement/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "待付款",
|
||||
title: "信息管理",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "obligation",
|
||||
name: "informationManagement",
|
||||
},
|
||||
{
|
||||
path: 'order/sendGoods',
|
||||
component: () => import('@/views/order/sendGoods'),
|
||||
path: 'brand/applicationReview',
|
||||
component: () => import('@/views/brand/applicationReview/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "待发货",
|
||||
title: "申请审核",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "sendGoods",
|
||||
name: "applicationReview",
|
||||
},
|
||||
{
|
||||
path: 'order/shipped',
|
||||
component: () => import('@/views/order/shipped'),
|
||||
path: 'brand/renewal',
|
||||
component: () => import('@/views/brand/renewal/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已发货",
|
||||
title: "续期",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "shipped",
|
||||
name: "renewal",
|
||||
},
|
||||
{
|
||||
path: 'order/receivedGoods',
|
||||
component: () => import('@/views/order/receivedGoods'),
|
||||
path: 'brand/management',
|
||||
component: () => import('@/views/brand/management/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已收货",
|
||||
title: "管理制度上传",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "receivedGoods",
|
||||
name: "management",
|
||||
},
|
||||
{
|
||||
path: 'order/completed',
|
||||
component: () => import('@/views/order/completed'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已完成",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "completed",
|
||||
},
|
||||
{
|
||||
path: 'order/cancelled',
|
||||
component: () => import('@/views/order/cancelled'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已取消",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "cancelled",
|
||||
},
|
||||
{
|
||||
path: 'order/salesService',
|
||||
component: () => import('@/views/order/salesService'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "退货/退款",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "salesService",
|
||||
},
|
||||
{
|
||||
path: 'order/refunded',
|
||||
component: () => import('@/views/order/refunded'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已退货/退款",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "refunded",
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
]
|
||||
|
6
src/views/brand/applicationReview/index.vue
Normal file
6
src/views/brand/applicationReview/index.vue
Normal file
@ -0,0 +1,6 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
开发中...
|
||||
</div>
|
||||
</template>
|
||||
<script setup></script>
|
460
src/views/brand/informationManagement/index.vue
Normal file
460
src/views/brand/informationManagement/index.vue
Normal file
@ -0,0 +1,460 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="container-custom">
|
||||
<!-- 搜索栏 -->
|
||||
<div ref="searchBarRef" class="search-box">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar-left">
|
||||
<el-form
|
||||
ref="searchForm"
|
||||
:inline="true"
|
||||
:model="formInline"
|
||||
class="demo-form-inline"
|
||||
:label-width="'auto'"
|
||||
>
|
||||
<el-form-item label="品牌编码" prop="code">
|
||||
<el-input
|
||||
v-model="formInline.code"
|
||||
placeholder="请输入品牌编码"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌名称" prop="title">
|
||||
<el-input
|
||||
v-model="formInline.title"
|
||||
placeholder="请输入品牌名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="使用状态" prop="status">
|
||||
<el-select v-model="formInline.status" placeholder="请选择" clearable>
|
||||
<el-option v-for="item in statusList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="添加时间"
|
||||
prop="startDate"
|
||||
style="margin-right: 0"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="formInline.startDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择起始日期"
|
||||
clearable
|
||||
:disabled-date="disableStartDate"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<span
|
||||
style="width: 30px; text-align: center; display: inline-block"
|
||||
>
|
||||
-
|
||||
</span>
|
||||
<el-date-picker
|
||||
v-model="formInline.endDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择截止日期"
|
||||
clearable
|
||||
:disabled-date="disableEndDate"
|
||||
style="width: 160px"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="Refresh"
|
||||
style="margin: 16px 0 0 0"
|
||||
@click="resetForm"
|
||||
>重置</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
|
||||
<div class="table-toolbar">
|
||||
<el-button
|
||||
icon="delete"
|
||||
@click="batchDelete"
|
||||
:disabled="btnStatus"
|
||||
style="margin-right: 10px"
|
||||
>批量删除</el-button
|
||||
>
|
||||
<el-button type="primary" class="el-button-gry" icon="plus" @click="handleAdd"
|
||||
>添加品牌</el-button
|
||||
>
|
||||
</div>
|
||||
<tableComponent
|
||||
:table-data="tableData"
|
||||
:columns="columns"
|
||||
:show-border="false"
|
||||
:show-selection="true"
|
||||
:header-cell-class-name="getHeaderClass"
|
||||
@page-change="handlePaginationChange"
|
||||
:loading="tableLoading"
|
||||
@selection-change="handleSelectionChange"
|
||||
:total="tableTotal"
|
||||
:current-page="formInline.current"
|
||||
:page-size="formInline.size"
|
||||
:showSort="true"
|
||||
:rowkey="'goodId'"
|
||||
>
|
||||
<!-- 自定义-图片 -->
|
||||
<template #imgPath="slotProps">
|
||||
<div class="table-cell-img-box">
|
||||
<img :src="slotProps.row.imgPath" class="table-cell-img" alt="" />
|
||||
</div>
|
||||
</template>
|
||||
<!-- 自定义-状态 -->
|
||||
<template #status="slotProps">
|
||||
<span v-if="slotProps.row.status == 1" class="color-green"
|
||||
>使用中</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.status == 0" class="color-red"
|
||||
>已停用</span
|
||||
>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button v-if="slotProps.row.status == 0" text class="el-button-custom" @click="seeDetails(slotProps.row)">启用</el-button>
|
||||
<el-button v-if="slotProps.row.status == 1" text class="el-button-custom" @click="seeDetails(slotProps.row)">停用</el-button>
|
||||
<el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 添加/编辑商品 -->
|
||||
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="500" :close-on-click-modal="false">
|
||||
<el-form :model="dialogForm" :label-width="'80'" :rules="dialogFormRules" ref="dialogRef">
|
||||
<el-form-item label="品牌名称" prop="title">
|
||||
<el-input v-model="dialogForm.title" autocomplete="off" placeholder="请输入品牌名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌图片" prop="imgPath">
|
||||
<myUploadImage v-model="dialogForm.imgPath" :limit="1" ></myUploadImage>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="onSaveCategory">
|
||||
保存
|
||||
</el-button>
|
||||
<el-button @click="cancelDialog">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import myUploadImage from "@/components/myUploadImage.vue";
|
||||
import Mock from "mockjs";
|
||||
import {getBrandbaseList,addBrand,updateBrand,deleteBrand,getBrandInfo} from "@/api/brand/index";
|
||||
import { id } from "element-plus/es/locales.mjs";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
const formInline = reactive({
|
||||
id: "",
|
||||
imgPath:'',//商品图片
|
||||
title: "",//商品名称
|
||||
code:'',//商品编码
|
||||
phoneNumber: "",//时间
|
||||
applicationNum:'',//申请数量
|
||||
useNum:'',//使用数量
|
||||
status: "",//状态
|
||||
startDate: "",//开始时间
|
||||
endDate: "",//结束时间
|
||||
current: 1,
|
||||
size: 10,
|
||||
});
|
||||
|
||||
let isADD = ref(true);
|
||||
const dialogFormVisible = ref(false);
|
||||
const dialogRef = ref(null);
|
||||
const dialogTitle = ref("添加品牌");
|
||||
let dialogForm = reactive({
|
||||
id: "",
|
||||
title: "",
|
||||
imgPath:"",
|
||||
|
||||
});
|
||||
const dialogFormRules = ref({
|
||||
title: [
|
||||
{ required: true, message: "请输入品牌名称", trigger: "blur" },
|
||||
]
|
||||
});
|
||||
|
||||
const statusList = ref([
|
||||
{ name: "使用中", id: "1" },
|
||||
{ name: "已停用", id: "0" },
|
||||
]);
|
||||
|
||||
// 禁用开始日期的逻辑(不能晚于已选的结束日期)
|
||||
const disableStartDate = (time) => {
|
||||
if (!formInline.endDate) return false;
|
||||
const endDate = new Date(formInline.endDate);
|
||||
return time.getTime() > endDate.getTime();
|
||||
};
|
||||
|
||||
// 禁用结束日期的逻辑(不能早于已选的开始日期)
|
||||
const disableEndDate = (time) => {
|
||||
if (!formInline.startDate) return false;
|
||||
const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
|
||||
const currentDate = new Date(time).setHours(0, 0, 0, 0);
|
||||
return currentDate < startDate;
|
||||
};
|
||||
|
||||
const searchForm = ref(null);
|
||||
|
||||
// 加载数据
|
||||
const loadData = async () => {
|
||||
|
||||
tableLoading.value = true;
|
||||
let prams = { ...formInline };
|
||||
|
||||
try {
|
||||
prams.startDate = formInline.startDate ? formInline.startDate + " 00:00:00" : "";
|
||||
prams.endDate = formInline.endDate ? formInline.endDate + " 23:59:59" : "";
|
||||
let response = await getBrandbaseList(prams);
|
||||
if (response.code == 200) {
|
||||
tableData.value = response.data.records;
|
||||
tableTotal.value = response.data.total;
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
tableLoading.value = false;
|
||||
};
|
||||
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
loadData();
|
||||
};
|
||||
|
||||
const resetForm = () => {
|
||||
searchForm.value.resetFields();
|
||||
formInline.endDate = "";
|
||||
loadData();
|
||||
};
|
||||
|
||||
// 表格数据
|
||||
const tableData = ref([]);
|
||||
const tableLoading = ref(false);
|
||||
const tableTotal = ref(0);
|
||||
let nowClickRow = ref({});
|
||||
// 列配置
|
||||
const columns = ref([
|
||||
{ prop: "id", label: "ID" },
|
||||
{ prop: "imgPath", label: "商品图片", slotName:'imgPath', width: "120", align: "left" },
|
||||
{ prop: "title", label: "商品名称" },
|
||||
{ prop: "code", label: "商品编码", width: "120" },
|
||||
{ prop: "createTime", label: "时间", width: "120" },
|
||||
{ prop: "applicationNum", label: "申请数量" },
|
||||
{ prop: "useNum", label: "使用数量" },
|
||||
{ prop: "status", label: "状态", slotName: "status" },
|
||||
{ prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
|
||||
]);
|
||||
|
||||
// 生成食物主题昵称
|
||||
const generateFoodNickname = () => {
|
||||
// 形容词(情绪/风格)
|
||||
const adjectives = [
|
||||
"暴躁的",
|
||||
"快乐的",
|
||||
"忧郁的",
|
||||
"疯狂的",
|
||||
"安静的",
|
||||
"慵懒的",
|
||||
"甜甜的",
|
||||
"咸咸的",
|
||||
"酸酸的",
|
||||
"辣辣的",
|
||||
];
|
||||
|
||||
// 食物名词(仅限食物)
|
||||
const foods = [
|
||||
"辣椒",
|
||||
"西瓜",
|
||||
"土豆",
|
||||
"番茄",
|
||||
"黄瓜",
|
||||
"苹果",
|
||||
"蛋糕",
|
||||
"面包",
|
||||
"披萨",
|
||||
"冰淇淋",
|
||||
"奶茶",
|
||||
"咖啡",
|
||||
"啤酒",
|
||||
"炸鸡",
|
||||
];
|
||||
|
||||
// 随机组合:形容词 + 食物
|
||||
return Mock.mock(`@pick(${adjectives})`) + Mock.mock(`@pick(${foods})`);
|
||||
};
|
||||
// 生成模拟数据
|
||||
const generateMockData = () => {
|
||||
return Mock.mock({
|
||||
"list|10": [
|
||||
{
|
||||
"id|+1": 10000,
|
||||
nickname: () => generateFoodNickname(), //昵称
|
||||
userName: "@cname", //姓名
|
||||
accountNumber: Mock.mock("@id").toString().slice(0, 10), //账号
|
||||
phoneNumber: "@integer(13000000000, 18999999999)", //手机号
|
||||
sex: '@pick(["男", "女"])', //性别
|
||||
"status|1": [0, 1], //0异常 1正常
|
||||
"userCategory|1":
|
||||
'@pick(["活跃/低消费", "活跃/中消费", "活跃/高消费"])', //用户分类
|
||||
unitPrice: "@float(10, 200, 2, 2)", //客单价
|
||||
ordersNums: "@integer(10, 200)",
|
||||
},
|
||||
],
|
||||
}).list;
|
||||
};
|
||||
// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
|
||||
const getHeaderClass = ({ column }) => {
|
||||
return "custom-header";
|
||||
};
|
||||
// 分页变化
|
||||
const handlePaginationChange = ({ page, pageSize }) => {
|
||||
console.log("分页变化:", page, pageSize);
|
||||
// 这里可以调用API获取新数据
|
||||
loadData();
|
||||
};
|
||||
// 多选框变化
|
||||
const handleSelectionChange = (selection) => {
|
||||
console.log("选中项:", selection);
|
||||
};
|
||||
|
||||
// 添加商品
|
||||
const handleAdd = () => {
|
||||
// console.log("handleAdd!");
|
||||
dialogTitle.value = "添加品牌";
|
||||
isADD.value = true;
|
||||
dialogFormVisible.value = true;
|
||||
// console.log(formInline);
|
||||
};
|
||||
//提交保存
|
||||
const onSaveCategory = async () => {
|
||||
dialogRef.value.validate(async (valid) => {
|
||||
if (valid) {
|
||||
if(isADD.value){
|
||||
let response = await addBrand(dialogForm);
|
||||
if (response.code === 200) {
|
||||
dialogFormVisible.value = false;
|
||||
ElMessage.success("新增成功!");
|
||||
dialogRef.value.resetFields();
|
||||
loadData();
|
||||
} else {
|
||||
ElMessage.error(response.message);
|
||||
}
|
||||
}else{
|
||||
let response = await updateBrand(dialogForm);
|
||||
if (response.code === 200) {
|
||||
dialogFormVisible.value = false;
|
||||
ElMessage.success("编辑成功!");
|
||||
dialogRef.value.resetFields();
|
||||
loadData();
|
||||
} else {
|
||||
ElMessage.error(response.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
};
|
||||
|
||||
// 编辑操作
|
||||
const handleEdit = async(row) => {
|
||||
isADD.value = false;
|
||||
dialogFormVisible.value = true;
|
||||
let response = await getBrandInfo(row.id);
|
||||
if (response.code === 200) {
|
||||
dialogForm = response.data;
|
||||
dialogTitle.value = "编辑品牌";
|
||||
} else {
|
||||
ElMessage.error(response.message);
|
||||
}
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = async(row) => {
|
||||
let response = await deleteBrand(row.id);
|
||||
if (response.code === 200) {
|
||||
ElMessage.success("品牌删除成功!");
|
||||
loadData();
|
||||
} else {
|
||||
ElMessage.error(response.message);
|
||||
}
|
||||
};
|
||||
//取消弹框
|
||||
const cancelDialog = () => {
|
||||
dialogRef.value.resetFields();
|
||||
dialogFormVisible.value = false;
|
||||
dialogTitle.value = "";
|
||||
dialogForm.title = "";
|
||||
dialogForm.imgPath = "";
|
||||
dialogForm.id = "";
|
||||
dialogForm.code = "";
|
||||
console.log('dialogForm',dialogForm);
|
||||
|
||||
};
|
||||
|
||||
const titleRef = ref(null);
|
||||
const searchBarRef = ref(null);
|
||||
const tableViewportHeight = ref(0);
|
||||
// 精确计算可用高度
|
||||
const calculateTableHeight = () => {
|
||||
// 获取窗口总高度
|
||||
const windowHeight = window.innerHeight;
|
||||
|
||||
// 获取各组件高度
|
||||
const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
|
||||
const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
|
||||
|
||||
// 计算容器内边距补偿(根据实际样式调整)
|
||||
const paddingCompensation = 130;
|
||||
|
||||
// 最终计算
|
||||
tableViewportHeight.value =
|
||||
windowHeight - headerHeight - searchBarHeight - paddingCompensation;
|
||||
// console.log(tableViewportHeight.value);
|
||||
};
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
|
||||
calculateTableHeight();
|
||||
|
||||
// 添加响应式监听
|
||||
window.addEventListener("resize", calculateTableHeight);
|
||||
|
||||
// 监听DOM变化(适用于动态变化的header/searchbar)
|
||||
const observer = new ResizeObserver(calculateTableHeight);
|
||||
if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
|
||||
if (searchBarRef.value) observer.observe(searchBarRef.value);
|
||||
});
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener("resize", calculateTableHeight);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.table-toolbar {
|
||||
width: 300px;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
padding: 14px 16px 0 0;
|
||||
}
|
||||
</style>
|
6
src/views/brand/management/index.vue
Normal file
6
src/views/brand/management/index.vue
Normal file
@ -0,0 +1,6 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
开发中...
|
||||
</div>
|
||||
</template>
|
||||
<script setup></script>
|
6
src/views/brand/renewal/index.vue
Normal file
6
src/views/brand/renewal/index.vue
Normal file
@ -0,0 +1,6 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
开发中...
|
||||
</div>
|
||||
</template>
|
||||
<script setup></script>
|
@ -278,10 +278,20 @@ const onSaveCategory = () => {
|
||||
};
|
||||
const addItem = () => {
|
||||
dialogTitle.value = "添加违禁物品";
|
||||
Object.assign(dialogForm, { // 保持响应性,手动清空字段
|
||||
id: "",
|
||||
violateGoodName: "",
|
||||
goodParameter: "",
|
||||
});
|
||||
dialogFormVisible.value = true;
|
||||
};
|
||||
const cancelDialog = () => {
|
||||
dialogRef.value.resetFields();
|
||||
Object.assign(dialogForm, { // 保持响应性,手动清空字段
|
||||
id: "",
|
||||
violateGoodName: "",
|
||||
goodParameter: "",
|
||||
});
|
||||
dialogFormVisible.value = false;
|
||||
};
|
||||
|
||||
|
@ -102,7 +102,7 @@ import {
|
||||
getGoodCategoryInfo,
|
||||
getGoodType,
|
||||
categoryAdd, categoryEdit,
|
||||
categoryRemove,enableAndDisableCategory
|
||||
categoryRemove, enableAndDisableCategory
|
||||
} from "@/api/goods/info";
|
||||
import { ca } from "element-plus/es/locales.mjs";
|
||||
const { proxy } = getCurrentInstance();
|
||||
@ -139,15 +139,15 @@ const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
formInline.status = formInline.status == undefined ? "" : formInline.status;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期!");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
console.log(formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
@ -256,7 +256,7 @@ const enableAndDisable = async (row, num) => {
|
||||
tableLoading.value = false;
|
||||
if (res.code == 200) {
|
||||
onSubmit();
|
||||
if (num == 1) {
|
||||
if (num == 1) {
|
||||
ElMessage.success("启用成功!");
|
||||
} else {
|
||||
ElMessage.success("禁用成功!");
|
||||
@ -280,7 +280,7 @@ const handleEdit = (row) => {
|
||||
dialogForm.name = row.name;
|
||||
dialogForm.level = row.level;
|
||||
dialogForm.parentId = row.parentId;
|
||||
dialogForm.status = row.status.toString();
|
||||
dialogForm.status = row.status?.toString() ?? '1';
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = (row) => {
|
||||
@ -314,7 +314,7 @@ const dialogTitle = ref("添加分类");
|
||||
const dialogForm = reactive({
|
||||
type: null, //分类类型归属,类型1->农资交易,2->供应商服务,3->采购商服务,4->土地交易
|
||||
name: "", //分类名字
|
||||
parentId: [], //父级id
|
||||
parentId: "", //父级id
|
||||
level: "", //分类层级,parentId的长度
|
||||
sort: "", //排序值
|
||||
status: "1", //分类状态(1-启用 2-禁用)
|
||||
@ -400,10 +400,27 @@ const onSaveCategory = () => {
|
||||
const addCategory = () => {
|
||||
dialogTitle.value = "添加分类";
|
||||
getGoodTypeList();
|
||||
dialogRef.value.resetFields();
|
||||
Object.assign(dialogForm, { // 保持响应性,手动清空字段
|
||||
id: "",
|
||||
type: null,
|
||||
name: "",
|
||||
level: "",
|
||||
parentId: "",
|
||||
status: "1",
|
||||
});
|
||||
dialogFormVisible.value = true;
|
||||
};
|
||||
const cancelDialog = () => {
|
||||
dialogRef.value.resetFields();
|
||||
Object.assign(dialogForm, { // 保持响应性,手动清空字段
|
||||
id: "",
|
||||
type: null,
|
||||
name: "",
|
||||
level: "",
|
||||
parentId: "",
|
||||
status: "1",
|
||||
});
|
||||
dialogFormVisible.value = false;
|
||||
};
|
||||
|
||||
|
@ -43,7 +43,7 @@
|
||||
<el-form-item label="商品图片" prop="goodUrl" required>
|
||||
<div>
|
||||
<!-- <myUploadImage v-model="formInline.goodUrl"></myUploadImage> -->
|
||||
<img style="width: 200px;" :src="formInline.goodUrl" alt="">
|
||||
<img style="width: 120px;" :src="formInline.goodUrl" alt="">
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 规格样式 -->
|
||||
@ -54,6 +54,9 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div v-if="formInline.specStyle == 1">
|
||||
<el-form-item label="规格名称" prop="goodSpecs" required>
|
||||
<el-input v-model="formInline.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
</el-form-item>
|
||||
<!-- 销售价格 -->
|
||||
<el-form-item label="销售价格" prop="salePrice" required>
|
||||
<el-input-number v-model="formInline.salePrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
@ -71,7 +74,12 @@
|
||||
<el-select v-model="formInline.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@ -84,7 +92,7 @@
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加属性</el-button>
|
||||
<!-- <el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加属性</el-button> -->
|
||||
</el-form-item>
|
||||
<!-- 价格库存 -->
|
||||
<el-form-item label="价格库存" prop="netWeight" required>
|
||||
@ -109,7 +117,12 @@
|
||||
<el-select v-model="item.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
@ -126,7 +139,7 @@
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加属性</el-button>
|
||||
<!-- <el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加属性</el-button> -->
|
||||
</el-form-item>
|
||||
<!-- 属性内容 -->
|
||||
<el-form-item label="属性内容" prop="attribute" required>
|
||||
@ -147,7 +160,7 @@
|
||||
<el-form-item prop="selectedAddress">
|
||||
<!-- 省市区级联选择器 -->
|
||||
<el-cascader v-model="formInline.selectedAddress" :options="addressOptions" :props="cascaderProps"
|
||||
placeholder="请选择省市区" clearable style="width: 300px;" />
|
||||
placeholder="请选择省市区" clearable style="width: 400px;" />
|
||||
</el-form-item>
|
||||
<el-form-item prop="detailAddress">
|
||||
<!-- 详细地址输入框 -->
|
||||
@ -568,7 +581,7 @@ const approved = async (index) => {
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data.list;
|
||||
addressOptions.value = res.data;
|
||||
}
|
||||
};
|
||||
const activeInfoList = ref([]);
|
||||
|
@ -42,7 +42,7 @@
|
||||
v-model="formInline.goodCategoryId"
|
||||
:options="goodsOptions"
|
||||
:props="cascaderProps"
|
||||
placeholder="请选择省市区"
|
||||
placeholder="请选择商品分类"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
@ -226,7 +226,7 @@ let nowClickRow = ref({});
|
||||
const columns = ref([]);
|
||||
const columns1 = ref([
|
||||
{ prop: "goodId", label: "ID", width: "150" },
|
||||
{ prop: "goodUrl", label: "商品图片", slotName: "goodUrl" },
|
||||
{ prop: "goodUrl", label: "商品图片", slotName: "goodUrl",align: "left" },
|
||||
{ prop: "goodName", label: "商品名称", width: "120" },
|
||||
{ prop: "categoryName", label: "分类名称" },
|
||||
{ prop: "goodPrice", label: "商品售价" },
|
||||
|
Loading…
x
Reference in New Issue
Block a user