czg_team/cashier-web
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of https://e.coding.net/g-cphe0354/cashier/cashier-web into ymf

Browse Source
This commit is contained in:
YeMingfei666
2025-02-24 09:51:59 +08:00
parent 0e644c507f bad27514f3
commit 59e1995253
5 changed files with 299 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

420
src/views/product/indexconfig/addgoods.vue
View File

@@ -49,10 +49,10 @@
</el-form-item> -->
<el-form-item label="商品类型">
<el-radio-group v-model="ruleForm.type" @change="changeTypeEnum(ruleForm.type)">
<el-radio label="single">单规格商品</el-radio>
<el-radio label="sku">多规格商品</el-radio>
<el-radio label="package">套餐商品</el-radio>
<el-radio label="weight">称重商品</el-radio>
<el-radio value="single">单规格商品</el-radio>
<el-radio value="sku">多规格商品</el-radio>
<el-radio value="package">套餐商品</el-radio>
<el-radio value="weight">称重商品</el-radio>
<!-- <el-radio label="coupon">团购券</el-radio> -->
</el-radio-group>
</el-form-item>
@@ -90,58 +90,56 @@
<template #header>
<el-button type="primary" @click="addgoods">添加商品</el-button>
</template>
<!-- <template slot="header" v-slot="scope"> -->
<!-- <el-button type="primary" @click="">添加商品</el-button> -->
<!-- </template> -->
<!-- <template v-slot="scope">
<el-button type="text" :disabled="scope.row.typeEnum != '多规格'"
<template v-slot="scope">
<el-button type="text" :disabled="scope.row.type != 'sku'"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text" @click="form.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template> -->
<el-button type="text"
@click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div v-if="ruleForm.groupType == '1'">
<div class="group_wrap" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
<el-form inline :model="item">
<el-form-item label="规格组名">
<el-input v-model="item.title" />
</el-form-item>
<el-form-item :label="`本组菜品${item.goods.length}选`">
<el-input v-model="item.number" />
</el-form-item>
<el-form-item>
<el-button @click="ruleForm.proGroupVo.splice(index, 1)">删除</el-button>
</el-form-item>
</el-form>
<div>
<el-table border :data="item.goods">
<el-table-column label="名称" prop="proName"></el-table-column>
<el-table-column label="规格" prop="skuName"></el-table-column>
<el-table-column label="价格" prop="price"></el-table-column>
<el-table-column label="数量" prop="number">
<template v-slot="scope">
<el-input-number v-model="scope.row.number" :min="0" />
</template>
</el-table-column>
<el-table-column width="150">
<template #header>
<!-- <el-button type="primary"
@click="$refs.shopListRef.show([...form.proGroupVo[index].goods]); addGroupIndex = index">添加商品</el-button> -->
</template>
<template v-slot="scope">
<el-button type="text" :disabled="scope.row.type != 'sku'"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text"
@click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<el-button type="primary" @click="addtaocan">添加套餐组</el-button>
</div>
</div>
<!--
<div v-if="ruleForm.groupType == 1">
<div class="group_wrap" v-for="(item, index) in form.proGroupVo" :key="index">
<el-form inline :model="item">
<el-form-item label="规格组名">
<el-input v-model="item.title" />
</el-form-item>
<el-form-item :label="`本组菜品${item.goods.length}选`">
<el-input v-model="item.number" />
</el-form-item>
<el-form-item>
<el-button @click="form.proGroupVo.splice(index, 1)">删除</el-button>
</el-form-item>
</el-form>
<div>
<el-table border :data="item.goods">
<el-table-column label="名称" prop="proName"></el-table-column>
<el-table-column label="规格" prop="skuName"></el-table-column>
<el-table-column label="价格" prop="price"></el-table-column>
<el-table-column label="数量" prop="number">
<template v-slot="scope">
<el-input-number v-model="scope.row.number" :min="0" />
</template>
</el-table-column>
<el-table-column width="150">
<template slot="header" slot-scope="scope">
<el-button type="primary"
@click="$refs.shopListRef.show([...form.proGroupVo[index].goods]); addGroupIndex = index">添加商品</el-button>
</template>
<template slot-scope="scope">
<el-button type="text" :disabled="scope.row.typeEnum != '多规格'"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text" @click="form.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<el-button type="primary" @click="$refs.shopListRef.show(); addGroupIndex = false">添加套餐组</el-button>
</div> -->
</el-form-item>
<el-form-item label="选择规格" v-if="ruleForm.type == 'sku'">
<el-select v-model="ruleForm.specId" placeholder="请选择规格" style="width: 500px" @change="selectSpecHandle">
@@ -153,7 +151,7 @@
<el-form-item :label="item.name" v-if="datas.selectSpeclist.length" v-for="item in datas.selectSpeclist"
:key="item.name">
<el-checkbox-group v-model="item.selectSpecResult" @change="selectSpecResultChange">
<el-checkbox :value="item.name" v-for="(item, index) in item.children" :key="index">{{ item.name
<el-checkbox :value="item.name" v-for="(ele, index) in item.children" :key="index">{{ ele.name
}}</el-checkbox>
</el-checkbox-group>
</el-form-item>
@@ -178,8 +176,8 @@
</el-form-item>
<el-form-item label="是否允许临时改价">
<el-radio-group v-model="ruleForm.isAllowTempModifyPrice">
<el-radio :label="1">允许</el-radio>
<el-radio :label="0">不允许</el-radio>
<el-radio :value="1">允许</el-radio>
<el-radio :value="0">不允许</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="每日销量上限">
@@ -201,7 +199,8 @@
<el-form-item>
<el-col :span="12">
<el-time-picker v-model="ruleForm.useTime" is-range range-separator="至" start-placeholder="开始时间"
end-placeholder="结束时间" :default-value="['00:00', '59:59']" value-format="HH:mm" format="HH:mm" />
end-placeholder="结束时间" :default-value="[new Date('00:00'), new Date('23:59')]" value-format="HH:mm"
format="HH:mm" />
</el-col>
</el-form-item>
<el-form-item label="上架">
@@ -235,6 +234,25 @@
</el-form>
<!-- 选择商品 -->
<shopList ref="shopListRef" @success="selectShopRes" />
<el-dialog :title="datas.selectSkuItem.proName" v-model="datas.showSelectSku">
<div class="pro_sku">
<div class="item">
<div class="row">
<div class="title">选项值</div>
<div class="tag" :class="{ active: item.active }" v-for="(item, index) in datas.selectSkuItem.skuList"
:key="item.id" @click="selectSkuHandle(item, index)">
{{ item.specInfo }}
</div>
</div>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="datas.showSelectSku = false">取 消</el-button>
<el-button type="primary" @click="showSelectSkuConfirm">确 定</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
@@ -250,7 +268,8 @@ import UserAPI4 from "@/api/product/specificationsconfig";
import shopList from "@/components/mycomponents/shopList.vue";
import { useRouter } from 'vue-router';
import { useTagsViewStore } from "@/store";
const tagsViewStore = useTagsViewStore();
const router = useRouter();
let list = ref<any[]>([{
"originPrice": 0,
@@ -262,7 +281,7 @@ let list = ref<any[]>([{
"weight": 0,
"barCode": "88888888888888888888"
}]);
let datas = reactive({
let datas = reactive<datasForm>({
cycle: [
{ label: "周一", value: "Monday" },
{ label: "周二", value: "Tuesday" },
@@ -288,9 +307,26 @@ let datas = reactive({
"barCode": "88888888888888888888"
},
specTableHeaders: [],
// 套餐商品-单规格index
selectSkuTableIndex: 0,
selectSkuConfirmIndex: 0,
showSelectSku: false,
selectSkuItem: {}
})
let shopListRef = ref(null)
interface datasForm {
cycle: { label: string, value: string }[],
Company: any[],
classification: any[],
specificationsconfig: any[],
selectSpeclist: any[],
defaultSku: any,
specTableHeaders: any[],
selectSkuTableIndex: any,
selectSkuConfirmIndex: number,
showSelectSku: boolean,
selectSkuItem: any
}
interface RuleForm {
name: string,
shortTitle: string,
@@ -299,12 +335,11 @@ interface RuleForm {
coverImg: string,
images: string[],
type: string,
specId: string,
specId: any,
groupType: string,
proGroupVo: string[],
skuList: string[],
weight: Number,
isAllowTempModifyPrice: Number,
weight: any,
isAllowTempModifyPrice: any,
days: string[],
useTime: string[],
startTime: string,
@@ -312,49 +347,11 @@ interface RuleForm {
isSale: string,
isStock: string,
isHot: string,
stockNumber: Number,
packFee: Number,
stockNumber: any,
packFee: any,
sort: Number,
}
// 添加商品
function addgoods() {
shopListRef.value.opens()
}
// 分组选择商品
function selectShopRes(res) {
// let newres = res.map(item => {
// item.proId = item.id
// item.proName = item.name
// item.price = item.lowPrice
// item.skuId = ''
// item.skuName = ''
// item.number = 1
// return item
// })
// if (this.form.groupType == 0) {
// let obj = {
// title: '',
// count: newres.length,
// number: '',
// goods: newres
// }
// this.form.proGroupVo = [{ ...obj }]
// } else {
// if (this.addGroupIndex !== false) {
// this.form.proGroupVo[this.addGroupIndex].count = newres.length
// this.form.proGroupVo[this.addGroupIndex].goods = newres
// } else {
// let arr = [...this.form.proGroupVo]
// arr.push({
// title: '',
// count: newres.length,
// number: '',
// goods: newres
// })
// this.form.proGroupVo = [...arr]
// }
// }
proGroupVo: any[],
selectSpecInfo: any
}
const ruleFormRef = ref<FormInstance>()
const ruleForm = reactive<RuleForm>({
@@ -408,6 +405,7 @@ const ruleForm = reactive<RuleForm>({
packFee: 0,
// 排序值
sort: 1,
selectSpecInfo: {}
})
const rules = reactive<FormRules<RuleForm>>({
name: [
@@ -439,10 +437,95 @@ const rules = reactive<FormRules<RuleForm>>({
onMounted(() => {
getList()
})
// 选择套餐商品sku
function selectSkuHandle(item: any, index: number) {
// 把所有的设置为false
datas.selectSkuItem.skuList.map((item: any, index: number) => {
let nitem = { ...item }
nitem.active = false
datas.selectSkuItem.skuList[index] = nitem
})
if (item.active) {
item.active = false
} else {
item.active = true
}
datas.selectSkuItem.skuList[index] = { ...item }
// let arr = datas.selectSkuItem.skuList.filter((item:any) => item.active)
// if (arr.length) {
// this.selectSkuConfirmDisabled = false
// } else {
// this.selectSkuConfirmDisabled = true
// }
}
// 确认套餐商品设置规格
function showSelectSkuConfirm() {
let item = datas.selectSkuItem.skuList.filter((item: any) => item.active)
ruleForm.proGroupVo[datas.selectSkuTableIndex].goods[datas.selectSkuConfirmIndex] = { ...ruleForm.proGroupVo[datas.selectSkuTableIndex].goods[datas.selectSkuConfirmIndex], skuId: item[0].id }
ruleForm.proGroupVo[datas.selectSkuTableIndex].goods[datas.selectSkuConfirmIndex] = { ...ruleForm.proGroupVo[datas.selectSkuTableIndex].goods[datas.selectSkuConfirmIndex], skuName: item[0].specInfo }
datas.showSelectSku = false
}
// 显示套餐商品设置规格
function showSelectSkuHandle(row: any, index: any, tabIndex: any) {
datas.selectSkuTableIndex = tabIndex
datas.selectSkuConfirmIndex = index
datas.showSelectSku = true
let obj = { ...row }
obj.skuList.map((item: any) => {
item.active = false
})
datas.selectSkuItem = obj
}
// 添加商品
function addgoods() {
(shopListRef.value as any)?.opens()
}
// 分组选择商品
function selectShopRes(res: Array<any>) {
console.log(res, '选择商品')
let newres = res.map(item => {
item.proId = item.id
item.proName = item.name
item.price = item.lowPrice
item.skuId = ''
item.skuName = ''
item.number = 1
return item
})
if (ruleForm.groupType == '0') {
let obj = {
title: '',
count: newres.length,
number: '',
goods: newres
}
ruleForm.proGroupVo = [{ ...obj }]
} else {
// if (this.addGroupIndex !== false) {
// this.form.proGroupVo[this.addGroupIndex].count = newres.length
// this.form.proGroupVo[this.addGroupIndex].goods = newres
// } else {
let arr = [...ruleForm.proGroupVo]
arr.push({
title: '',
count: newres.length,
number: '',
goods: newres
})
ruleForm.proGroupVo = [...arr]
// }
}
}
// 获取单位、分类数据
async function getList() {
datas.Company = await UserAPI2.getList()
datas.classification = await UserAPI.getList()
datas.Company = (await UserAPI2.getList(null)) as any[]
datas.classification = (await UserAPI.getList(null)) as any[]
}
// 选择规格属性
function selectSpecResultChange() {
@@ -463,7 +546,10 @@ function createSkuHeader() {
}
datas.specTableHeaders = headers;
}
// 可选套餐弹窗
function addtaocan() {
(shopListRef.value as any)?.opens()
}
// 生成多规格表体
function createSkuBody() {
let bodys = [];
@@ -486,7 +572,7 @@ function createSkuBody() {
let newarr = [];
for (let item of arr) {
if (Array.isArray(item)) {
let obj = {};
let obj: Record<string, any> = {};
let specSnap = [];
for (let v of item) {
for (let key in v) {
@@ -522,7 +608,7 @@ function createSkuBody() {
list.value = newarr;
}
// 切换类型
function changeTypeEnum(item) {
function changeTypeEnum(item: string) {
// single-单规格商品 sku-多规格商品 package-套餐商品 weight-称重商品 coupon-团购券
list.value = []
if (item == 'sku') {
@@ -534,41 +620,42 @@ function changeTypeEnum(item) {
}
}
// 笛卡尔积算法
function cartesian(arr) {
function cartesian(arr: any[]) {
if (arr.length < 2) return arr[0] || [];
return [].reduce.call(arr, (col, set) => {
let res = [];
col.forEach((c) => {
set.forEach((s) => {
let t = [].concat(Array.isArray(c) ? c : [c]);
return [].reduce.call(arr, (col: any, set: any, index) => {
let res = <any>[];
col.forEach((c: any) => {
set.forEach((s: any) => {
let arr: any = Array.isArray(c) ? c : [c]
let t: any[] = [].concat(arr);
t.push(s);
res.push(t);
});
});
return res;
});
}, []);
}
// 套餐类型切换
function typeChange() {
ruleForm.typeEnum = 'normal'
if (ruleForm.groupType == 0) {
// this.$set(this.form.proGroupVo, 0, {
// title: '',
// count: '',
// number: 1,
// goods: []
// })
// ruleForm.typeEnum = 'normal'
if (ruleForm.groupType == '0') {
ruleForm.proGroupVo[0] = {
title: '',
count: '',
number: 1,
goods: []
}
} else {
// this.form.proGroupVo = []
ruleForm.proGroupVo = []
}
// this.changeTypeEnum()
}
// 获取规格列表
async function tbProductSpecGet() {
datas.specificationsconfig = await UserAPI4.getPage()
datas.specificationsconfig = (await UserAPI4.getPage(null)) as []
}
// 选择规格
function selectSpecHandle(e) {
function selectSpecHandle(e: any) {
const selectSpec = JSON.parse(JSON.stringify(datas.specificationsconfig.find((item) => item.id == e).children));
for (let item in selectSpec) {
selectSpec[item].selectSpecResult = [];
@@ -590,20 +677,32 @@ const submitForm = async (formEl: FormInstance | undefined) => {
ruleForm.startTime = ruleForm.useTime[0]
ruleForm.endTime = ruleForm.useTime[1]
// 拿到sku数据
ruleForm.skuList = specificationAttributeRef.value.getdata()
ruleForm.skuList = (specificationAttributeRef.value as any)?.getdata()
// 多规格 selectSpecInfo 添加
if (ruleForm.type == 'sku') {
let obj = {}
let obj: any = {}
datas.selectSpeclist.forEach((item: any) => {
obj[item.name] = item.selectSpecResult
})
ruleForm.selectSpecInfo = obj
} else if (ruleForm.type == 'package') {
console.log(ruleForm, '套餐')
}
console.log(ruleForm, '提交数据')
let res = await UserAPI3.addunit(ruleForm)
if (res.code == 200) {
ElMessage.success("添加成功");
router.push({ name: 'productIndex' });
setTimeout(() => {
closeSelectedTag({
"name": "addgoods",
"title": "新增商品",
"path": "/product/addgoods",
"fullPath": "/product/addgoods",
"affix": false,
"keepAlive": true,
"query": {}
})
}, 500);
}
} else {
ElMessage.error("请填写完整信息");
@@ -611,10 +710,20 @@ const submitForm = async (formEl: FormInstance | undefined) => {
}
})
}
// 关闭当前窗口
function closeSelectedTag(view: TagView) {
tagsViewStore.delView(view).then((res: any) => {
if (tagsViewStore.isActive(view)) {
tagsViewStore.toLastView(res.visitedViews, view);
}
});
}
// 规格id过滤
const specIdFunction = (type: string) => {
if (type === 'single') {
return null
return ''
} else if (type === '2') {
return 2
} else if (type === '3') {
@@ -626,6 +735,15 @@ const specIdFunction = (type: string) => {
}
}
const resetForm = (formEl: FormInstance | undefined) => {
closeSelectedTag({
"name": "addgoods",
"title": "新增商品",
"path": "/product/addgoods",
"fullPath": "/product/addgoods",
"affix": false,
"keepAlive": true,
"query": {}
})
if (!formEl) return
formEl.resetFields()
}
@@ -635,4 +753,44 @@ const resetForm = (formEl: FormInstance | undefined) => {
padding: 20px;
background-color: #fff;
}
.pro_sku {
.item {
.row {
display: flex;
align-items: center;
&:not(:first-child) {
margin-top: 20px;
}
.title {
width: 80px;
}
.tag {
background-color: #F7F7FA;
padding: 6px 12px;
margin-right: 10px;
border-radius: 4px;
&.no {
background: none;
padding: 6px 0;
}
&.active {
background-color: #46A6FF;
color: #fff;
}
}
}
}
}
.group_wrap {
padding: 20px;
background-color: #F7F7FA;
margin-bottom: 20px;
}
</style>