This commit is contained in:
@fawn-nine
2024-05-27 17:09:18 +08:00
parent 12c8a54870
commit df1a867db0
6 changed files with 2571 additions and 98 deletions

View File

@@ -11,8 +11,8 @@
<div class="addFormBox">
<el-form :model="addForm" ref="addForm" label-width="80px">
<el-form-item label="小店名称" prop="title" class="form_item">
<el-input placeholder="请输入小店名称" style="width: 100%" v-model="addForm.title" clearable>
<el-form-item label="小店名称" prop="name" class="form_item">
<el-input placeholder="请输入小店名称" style="width: 100%" v-model="addForm.name" clearable>
</el-input>
</el-form-item>
<el-form-item label="排序" prop="sort" class="form_item">
@@ -20,7 +20,9 @@
@keyup.native="UpNumber" @keydown.native="UpNumber">
</el-input-number>
</el-form-item>
<el-form-item label="封面图" prop="images" label-width="120px">
<el-form-item label="封面图" prop="images" label-width="120px" >
<div style="display:flex; align-items:center">
<div>
<el-upload
class="avatar-uploader"
:action="baseUrl + '/oss/fileoss'"
@@ -29,47 +31,30 @@
>
<!-- <img v-if="!refreshImg" :src="addForm.images" class="avatar"> -->
<img v-if="fimages" :src="fimages" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
<el-tag
type="danger">*
</el-tag>
</el-upload>
</el-form-item>
<!-- <el-form-item label="是否为最终级" prop="isLast" label-width="120px" class="form_item">
<el-switch v-model="addForm.isLast" active-color="#13ce66" :active-value="1" :inactive-value="0"
active-text="" inactive-text="" @change="handleChangeIsLast">
</el-switch>
</el-form-item> -->
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload></div>
<div> <el-tag v-if="fimages != ''" class="delImgBtn" @click="delImg()" type="danger">清空图片</el-tag></div></div>
</el-form-item>
</el-form>
</div>
<div style=" border: 1px dashed #bababa;" v-if="currentNode && currentNode.data.isLast == 1"></div>
</div>
<div class="border_box tree_content_box" v-if="currentNode && currentNode.data.isLast == 1">
<div class="title_box" style="margin-bottom: 10px; height: 40px">
<div class="border_box tree_content_box" v-if="addForm.id" >
<div class="title_box" style="margin-bottom: 10px; height: 80px; display:block;">
<div class="title">
<span class="line"></span>已关联商品列表
<el-button plain type="primary" style="margin-left: 20px" @click="openTable('addForm')"
size="mini">新增</el-button>
<!-- <div style="" class="button_box"> -->
<el-button plain type="danger" @click="handleCheckAllChange(true)" size="mini">清空</el-button>
<!-- <el-button plain type="danger" @click="handleCheckAllChange(true)" size="mini">清空</el-button> -->
<!-- </div> -->
</div>
</div>
<commonShop :currentId="addForm.id ? addForm.id : ''" currentType="bookMarketId" :dataList="associatedGoodsList"
:urlList="urlList" @delete="dataFormDelete" :isEdit="isEdit" :oprateType="oprateType" ref="commonShop" :style="`height: calc(100% - 50px); `"></commonShop>
<!-- <div class="submitButtonBox" v-if="isEdit">
<el-checkbox v-model="checkAll" @change="handleCheckAllChange" style="float: left">全选</el-checkbox>
<div class="submitButton">
<el-button type="danger" @click="dataFormDelete('addForm')" size="small">删除</el-button>
</div>
</div> -->
<!-- <div class="submitButtonBox" v-else> -->
<!-- <el-button @click="handlereset" size="small">取消</el-button> -->
<div class="submitButton submitButtonBox" >
<!-- <el-button size="small" @click.stop="dataFormEdit()">
取消
@@ -118,11 +103,11 @@ export default {
isIndeterminate: true,
urlList: {
treeList: "/master/shopStore/getStoreList",
delete: "/book/shopStore/unbindStoreAndProduct",
delete: "/master/shopStore/unbindStoreAndProduct",
deleteShop: "/master/shopStore/delStore",
saveShop: "/master/shopStore/saveOrUpdateStore",
add: "/master/shopStore/saveOrUpdateStore",
getAssociatedGoodsList: "/book/shopStore/getStoreProductList",
getAssociatedGoodsList: "/master/shopStore/getStoreProductList",
},
oprateType:"yingxiao", // yingxiao类型是营销 fenlei:类型是分类
addForm: {},
@@ -189,7 +174,11 @@ export default {
// //this.refreshImg = true
// console.log(this.addForm)
// // this.dialogVisible = true;
// },
// },
delImg(){
this.fimages = ''
this.addForm.images = '';
},
handlePicSuccess(res, file) {
// console.log(res,'res')
// if (res.msg == "success") {
@@ -208,11 +197,11 @@ export default {
this.checkAll = false;
this.isEdit = !this.isEdit;
},
handleCheckAllChange(val) {
this.$nextTick(() => {
this.$refs.commonShop.handleCheckAllChange(val);
});
},
// handleCheckAllChange(val) {
// this.$nextTick(() => {
// this.$refs.commonShop.handleCheckAllChange(val);
// });
// },
handleSubmitShopTable: debounce(async function (ids) {
await this.$http({
url: this.$http.adornUrl(`${this.urlList.saveShop}`),
@@ -226,10 +215,12 @@ export default {
this.$message.success(data.msg);
if (this.$refs.commonShop) {
this.$refs.commonShop.getAssociatedGoodsList({
bookMarketId: this.addForm.id,
});
if(addForm.id != ''){
// console.log(addForm.id,'addForm.id')
this.$refs.commonShop.getAssociatedGoodsList({
bookMarketId: this.addForm.id,
});
}
}
if (this.$refs.commonShopTable) {
this.$refs.commonShopTable.close();
@@ -265,56 +256,53 @@ export default {
console.log("🚀 ~ getCommonShopDataList ~ type, id:", type, id);
this.currentNode = { data: { ...form } }
this.addForm = form;
this.fimages = form.images
await this.getDataList();
// this.$refs.commonTree.setCurrentNodeShow();
this.$nextTick(() => {
// this.$refs.commonShop.clear();
// this.$refs.commonShop.bookMarketId = null;
if (form.isLast == 1) {
if (this.$refs.commonShop) {
this.$refs.commonShop.getAssociatedGoodsList();
}
}
// this.$refs.commonShop.bookMarketId = null;
if (this.$refs.commonShop && id) {
this.$refs.commonShop.getAssociatedGoodsList(form);
}
});
},
//新增修改
dataFormSubmit: debounce(async function (formName) {
// return false
if (this.addForm.title == "" || !this.addForm.title) {
if (this.addForm.name == "" || !this.addForm.name) {
this.$message.error("请输入小店名称");
return false;
}
console.log(this.addForm,'+++++++++++++')
return false
var form={...this.addForm}
delete form.children
await this.$refs[formName].validate(async (valid) => {
if (valid) {
await this.$http({
url: this.$http.adornUrl(`${this.urlList.add}`),
method: "post",
data: this.$http.adornData({
...this.addForm,
...form,
}),
}).then(async ({ data }) => {
if (data && data.code === 0) {
// var status = await this.correlationShop(data.result.id);
if (data && data.code === 0) {
await this.getDataList();
this.$nextTick(async () => {
this.$refs.commonTree.setCurrentNodeShow(data.result.id);
this.addForm = data.result;
this.currentNode = { data: { ...data.result } }
this.fimages= data.result.images
// this.currentNode = { data: { ...data.list } }
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.visible = false;
},
});
});
@@ -325,7 +313,7 @@ export default {
}
});
}, 200),
//新增修改
//删除关联商品
dataFormDelete: debounce(async function (row, deleteType) {
this.$confirm(`确定要删除${deleteType != 'all' ? '该' : '所有'}关联商品嘛?`, "提示", {
confirmButtonText: "确定",
@@ -333,8 +321,8 @@ export default {
type: "warning"
})
.then(async () => {
var lableIds = row[0].bookLabelId
var productIds = row.map(e => e.productId)
// var lableIds = row[0].bookLabelId
// var productIds = row.map(e => e.productId)
// // return false
// var selectShopArr = this.$refs.commonShop.selectShopArr;
@@ -344,12 +332,20 @@ export default {
// this.$message.error("请选择已关联的商品");
// return false;
// }
this.$refs.commonShop.dataListLoading = true;
await this.$http({
url: this.$http.adornUrl(
`${this.urlList.deleteShop}?marketId=${this.addForm.id}&productId=${productIds.toString(",")}`
`${this.urlList.delete}`
),
method: "post",
data: {
id:row[0].id
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json"
}
}).then(async ({ data }) => {
if (data && data.code === 0) {
this.$message.success("删除成功");
@@ -399,16 +395,16 @@ export default {
case "edit":
form = { ...node.data };
break;
case "addChildren":
form = {
children: [],
delFlag: 0,
isLast: 0,
pid: data.id,
sort: 0,
title: "",
};
break;
// case "addChildren":
// form = {
// children: [],
// delFlag: 0,
// isLast: 0,
// pid: data.id,
// sort: 0,
// title: "",
// };
// break;
}
this.addForm = { ...form };
@@ -420,18 +416,12 @@ export default {
},
addOrUpdateHandle() {
var addform = {
children: [],
delFlag: 0,
isLast: 0,
pid: 0,
images: 0,
sort: 0,
title: "",
name: "",
id:null
};
this.handleClickNodes({ data: addform }, addform, "add");
// if (!this.currentNode) {
// this.$message.error("请先选择分类");
// return;
// }
this.handleClickNodes({ data: addform }, addform, "add");
},
filterNode(value, data) {
@@ -688,16 +678,15 @@ export default {
this.dataListLoading = true;
await this.$http({
url: this.$http.adornUrl(this.urlList.treeList),
method: "get",
// params: this.$http.adornParams({
// 'page': this.pageIndex,
// 'limit': this.pageSize,
// 'key': this.dataForm.key
// })
method: "post",
data: this.$http.adornData({
"current": 1,
"limit": 10
})
}).then(({ data }) => {
console.log("🚀 ~ getDataList ~ data:", data);
if (data && data.code === 0) {
this.treeDataList = data.result;
this.treeDataList = data.list;
// this.totalPage = data.page.totalCount
} else {
this.treeDataList = [];
@@ -732,6 +721,7 @@ export default {
};
</script>
<style lang="less" scoped>
.delImgBtn{cursor: pointer; display: inline-block; margin-left: 10px;}
.el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
@@ -746,14 +736,14 @@ export default {
border: 1px dashed #d9d9d9; border-color: #409EFF;
font-size: 28px;
color: #8c939d;
width: 100px;
height: 100px;
line-height: 100px;
width: 70px;
height: 70px;
line-height: 70px;
text-align: center;
}
.avatar {
width: 100px;
height: 100px;
width: 70px;
height: 70px;
display: block;
}
.tree_box {
@@ -768,8 +758,8 @@ export default {
}
.border_box {
height: 100px;
margin-bottom: 10px;
margin-bottom: 10px; height: 138px;
.title_box {
display: flex;