提交 3951873a authored 作者: 刘旭's avatar 刘旭

完成配件修改功能

上级 3f03c869
......@@ -7,8 +7,8 @@ export default function useBaseLogin() {
//表单绑定的数据
const loginModel = reactive<LoginParm>({
username: 'admin',
password: '123456',
username: '',
password: '',
code: ''
})
//表单验证规则
......
<template>
<div style="display: flex; flex-direction: column;">
<div style="display: flex; flex-direction: row; margin-bottom: 20px;">
<div style="margin-right: 50px;">配件</div>
<el-button type="primary" size="small" @click="handlePartsShow">添加</el-button>
</div>
<el-table :data="partsData.partList" border>
<el-table-column prop="partGoodsName" label="配件名" />
<el-table-column prop="bomCode" label="BOM" />
<el-table-column align="center" label="操作" width="100" class-name="small-padding fixed-width">
<template #default="scope">
<el-button type="warning" size="small" @click="handlePartsDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog v-model="partsVisiable" title="添加配置" :modal-append-to-body="true" :append-to-body="true">
<el-form ref="partsRef" :model="partsForm" :rules="rules" status-icon label-position="left" label-width="100px"
style="width: 400px; margin-left: 50px">
<el-form-item label="名称" prop="partGoodsName">
<el-input v-model="partsForm.partGoodsName" />
</el-form-item>
<el-form-item label="品牌" prop="bomCode">
<el-input v-model="partsForm.bomCode" />
</el-form-item>
</el-form>
<template #footer class="dialog-footer">
<el-button @click="partsVisiable = false">取消</el-button>
<el-button type="primary" @click="handlePartsAdd">确定</el-button>
</template>
</el-dialog>
</template>
<script setup lang='ts'>
import { ref } from 'vue'
let props = defineProps({
partsData: {
type: Object,
default: {}
}
})
let emits = defineEmits(['partsChange'])
let rules = ref({
partGoodsName: { required: true, message: '', trigger: 'blur' },
bomCode: { required: true, message: '', trigger: 'blur' }
})
let partsRef = ref()
let partsVisiable = ref(false)
let partsForm = ref({ partGoodsName: "", bomCode: "" });
let handlePartsShow = () => {
partsForm.value = { partGoodsName: "", bomCode: "" };
partsVisiable.value = true;
}
let handlePartsAdd = () => {
partsRef.value?.validate((valid: boolean) => {
if (valid) {
emits('partsChange', 'add', partsForm.value, props.partsData.index)
partsVisiable.value = false;
}
})
}
let handlePartsDelete = (row: any) => {
emits('partsChange', 'delete', row, props.partsData.index)
}
</script>
<style lang = "scss" scoped>
</style>
\ No newline at end of file
......@@ -23,16 +23,20 @@
<el-table-column type="expand">
<template #default="scope">
<el-row style="padding: 30px;">
<el-col :span="12" style="margin-right: 30px;">
<el-col :span="8" style="margin-right: 30px;">
<params-attr
:attributeData="{ attributeList: scope.row.attributeList, index: scope.$index }"
@paramsChange="paramsChange" style="width: 50%;" />
</el-col>
<el-col :span="11">
<el-col :span="8">
<main-config
:mainConfigurationsData="{ mainConfigurationsList: scope.row.mainConfigurationsList, index: scope.$index }"
@mainConfigChange="mainConfigChange" style="width: 50%;" />
</el-col>
<el-col :span="7" style="margin-left: 2%">
<parts :partsData="{ partList: scope.row.partList, index: scope.$index }"
@partsChange="partsChange" style="width: 50%;" />
</el-col>
</el-row>
</template>
</el-table-column>
......@@ -64,6 +68,7 @@ import { ElMessage } from 'element-plus'
import paramsAttr from './paramsAttr.vue'
import mainConfig from './mainConfig.vue'
import addSpecifications from './addSpecifications.vue'
import parts from './parts.vue'
let props = defineProps({
specData: {
......@@ -149,6 +154,28 @@ let mainConfigChange = (type: string, data: any, index: any) => {
}
}
// 配件操作
let partsChange = (type: string, data: any, index: any) => {
if (type === 'add') {
if (specificationData.value[index].id !== 'undefined') {
specificationData.value[index].updateTime = null
}
specificationData.value[index].partList.unshift(data)
emits('productsData', specificationData.value)
}
else {
const i = specificationData.value[index].partList.indexOf(data);
let deleteIndexPartsData: any = {} // 记录要被删除的数据
if (typeof specificationData.value[index].partList[i].deleted !== 'undefined') { // deleted标为ture即为删除
deleteIndexPartsData = specificationData.value[index].partList[i] // 记录要被删除的数据
deleteIndexPartsData.deleted = true
deleteIndexPartsData.updateTime = null
}
specificationData.value[index].partList.splice(i, 1)
emits('productsData', specificationData.value, index, undefined, undefined, undefined, undefined, undefined, i, deleteIndexPartsData)
}
}
// 每组只可以取一个
let radioChange = (e: any, item: any) => {
// console.log(e, item);
......@@ -183,7 +210,8 @@ let clickAdd = (formData: any) => {
number: 0,
url: "",
attributeList: [],
mainConfigurationsList: []
mainConfigurationsList: [],
partList: []
}
data = { ...data, ...formData }
specificationData.value.push(data)
......@@ -227,11 +255,11 @@ let poty = ref()
// 把相同数据分组
let group = (data: any) => {
let arr = [] as any //记录相同索引
let test1 = [...data] // 拷贝
let copyArr = [...data] // 拷贝
let list = [] as any // 记录相同value
let spec = test1[0].specification // 记录specification
test1.forEach((item: any, i: number) => {
if (item.specification == test1[0].specification) {
let spec = copyArr[0].specification // 记录specification
copyArr.forEach((item: any, i: number) => {
if (item.specification == copyArr[0].specification) {
arr.push(i)
list.push({
value: item.value,
......@@ -245,13 +273,13 @@ let group = (data: any) => {
if (arr.length > 1) {
if (index < 0) {
index = 0
test1.splice(index, 1)
copyArr.splice(index, 1)
} else {
index -= sum
test1.splice(index, 1)
copyArr.splice(index, 1)
}
} else {
test1.splice(index, 1)
copyArr.splice(index, 1)
}
});
specData.value.push({
......@@ -259,8 +287,8 @@ let group = (data: any) => {
values: list,
specRadio: ''
})
if (test1.length === 0) return poty.value = [...specData.value]
else group(test1)
if (copyArr.length === 0) return poty.value = [...specData.value]
else group(copyArr)
}
defineExpose({
......
......@@ -368,16 +368,19 @@ let htmlChange = (value: any) => nextTick(() => goods.value.detail = value)
let deleteData = [] as any //记录删除数据
let deleteParamsData = [] as any //记录规格属性子数据table删除数据
let deleteMainData = [] as any //记录规格属性子数据table删除数据
let deletePartsData = [] as any //记录规格属性子数据table删除数据
// deleteIndexData 记录被删除的数据, deleteIndex 记录被删除数据的索引
// 继续推si山吧 。。。
let productsData = (data: any, deleteIndex?: any, deleteIndexData?: any,
deleteParamsIndex?: any, deleteParamsIndexData?: any, deleteMainIndex?: any, deleteMainIndexData?: any) => {
deleteParamsIndex?: any, deleteParamsIndexData?: any, deleteMainIndex?: any,
deleteMainIndexData?: any, deletePartsIndex?: any, deletePartsIndexData?: any) => {
products.value = data
if (deleteIndexData) {
if (deleteIndexData.deleted !== undefined || deleteIndexData.deleted) {
deleteData.push({ deleteIndexData, deleteIndex })
}
}
if (deleteParamsIndexData) {
if (deleteParamsIndexData.deleted !== undefined || deleteParamsIndexData.deleted) {
deleteParamsData.push({ deleteParamsIndexData, deleteParamsIndex, deleteIndex })
......@@ -391,6 +394,13 @@ let productsData = (data: any, deleteIndex?: any, deleteIndexData?: any,
console.log('删除主要配置', deleteMainData);
}
}
if (deletePartsIndexData) {
if (deletePartsIndexData.deleted !== undefined || deletePartsIndexData.deleted) {
deletePartsData.push({ deletePartsIndexData, deletePartsIndex, deleteIndex })
console.log('删除配件', deletePartsData);
}
}
}
let handleCategoryChange = (value: any) => {
......@@ -434,6 +444,11 @@ let handleEdit = () => {
// 要子数据参数table删除数据
if (deleteParamsData.length !== 0) {
deleteParamsData.map((item: any) => {
// table中只有一天数据的时候
if (products.value[item.deleteIndex].attributeLis.length === 0) {
products.value[item.deleteIndex].updateTime = null
products.value[item.deleteIndex].attributeList.push(item.deleteParamsIndexData)
} else
products.value[item.deleteIndex].attributeList.map((res: any, r: number) => {
if (r === item.deleteIndex) {
products.value[item.deleteIndex].updateTime = null
......@@ -445,14 +460,38 @@ let handleEdit = () => {
// 要子数据主要配置table删除数据
if (deleteMainData.length !== 0) {
deleteMainData.map((item: any) => {
if (products.value[item.deleteIndex].mainConfigurationsList.length === 0) {
products.value[item.deleteIndex].updateTime = null
products.value[item.deleteIndex].mainConfigurationsList.push(item.deleteMainIndexData)
} else
products.value[item.deleteIndex].mainConfigurationsList.map((res: any, r: number) => {
if (r === item.deleteIndex) {
console.log('mainsdksadn');
products.value[item.deleteIndex].updateTime = null
products.value[r].mainConfigurationsList.push(item.deleteMainIndexData)
}
})
})
}
// 要子数据配件table删除数据
if (deletePartsData.length !== 0) {
deletePartsData.map((item: any) => {
console.log(item, 'partList', products.value[item.deleteIndex]);
if (products.value[item.deleteIndex].partList.length === 0) {
products.value[item.deleteIndex].updateTime = null
products.value[item.deleteIndex].partList.push(item.deletePartsIndexData)
} else
products.value[item.deleteIndex].partList.map((res: any, r: number) => {
console.log(r, item.deleteIndex, 'deleteIndex');
if (r === item.deleteIndex) {
console.log('deleteIndexbbbb');
products.value[item.deleteIndex].updateTime = null
products.value[r].partList.push(item.deletePartsIndexData)
}
})
})
}
console.log(products.value, 'products.value');
specifications.value = [...specificationsDeleteData.value, ...specifications.value]
const finalGoods = {
goods: goods.value,
......
......@@ -247,7 +247,6 @@ function init() {
// 是否启用
const switchChange = (value: boolean, userId: any) => {
// console.log(value, userId);
userEnabled(userId).then((res: any) => {
if (res.code === 200) {
init()
......@@ -257,7 +256,6 @@ const switchChange = (value: boolean, userId: any) => {
// 上传头像
let uploadPicUrl = (res: any) => {
console.log(res);
avatarUrl.value = res.data.url;
formData.value.avatar = res.data.url
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论