zm/nuttyreading-master-html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

商品绑定标签

Browse Source
This commit is contained in:
始于初见
2024-05-09 13:29:10 +08:00
parent a677ca196c
commit d30e19e446
10 changed files with 3565 additions and 666 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/views/components/commonBookTags/shopproduct.vue
View File

@@ -1,5 +1,5 @@
<template>
<div style="width: 100%; height: 100%; margin-top: -50px">
<div class="commonShopproduct" :style="`width: 100%; height: 100%; margin-top: -50px`">
<!-- <el-form
:inline="true"
@@ -29,9 +29,9 @@
<div class="search_form">
<div class="addFormBox shopFormBox">
<el-form ref="addForm" label-width="80px" :model="dataForm">
<slot name="searchFormItem" :dataForm="dataForm"></slot>
<slot name="searchFormItem" :dataForm="dataForm" v-if="!isNoSearch"></slot>
<el-form-item
<el-form-item v-if="!isNoSearch"
label=""
class="form_item"
label-width="20px"
@@ -158,7 +158,8 @@ export default {
"urlList",
"isEdit",
"currentId",
"currentType"
"currentType",
"isNoSearch",
],
data() {
return {

21
src/views/components/commonBookTags/shopproductTable.vue
View File

@@ -7,6 +7,9 @@
:visible.sync="drawer"
destroy-on-close
direction="rtl"
:append-to-body="true"
:modal-append-to-body="false"
:modal="!isNoModal"
size="70%"
>
<div class="shop_drawer_box demo-drawer__content">
@@ -38,7 +41,7 @@
</div>
<el-table
ref="table"
height="80%"
height="calc(100% - 120px)"
:data="dataList"
:row-key="getRowKeys"
border
@@ -64,6 +67,7 @@
<!-- -->
</el-table>
<el-pagination
style="float: right;margin-top: 20px;"
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
@@ -93,7 +97,15 @@
// import chooseBook from './chooseBook.vue'
// import AddOrUpdate from './shopproduct-add-or-update'
export default {
props: ["defaultForm","marketIdKey", "currentType", "currentId", "title", "urlList"],
props: [
"defaultForm",
"marketIdKey",
"currentType",
"currentId",
"title",
"isNoModal",
"urlList"
],
data() {
return {
timer: null,
@@ -103,9 +115,7 @@ export default {
multipleSelectionAll: [], // 所有选中的数据包含跨页数据
multipleSelection: [], // 当前页选中的数据
idKey: "productId", // 标识列表数据中每一行的唯一键的名称(需要按自己的数据改一下)
dataForm: {
},
dataForm: {},
bookMarketId: null,
dataList: [],
publishStatus: false,
@@ -338,6 +348,7 @@ export default {
<style lang="less" scoped>
.shop_drawer_box {
padding: 20px !important;
padding-top: 0px !important;
box-sizing: border-box;
width: 100%;
height: 100%;

35
src/views/modules/course/course-add-or-update.vue
View File

@@ -315,6 +315,9 @@ export default {
// splits: [
// { required: true, message: '拆分类类型不能为空', trigger: 'blur' }
// ]
},
urlList: {
info: "/master/course/getCoursedetail"
}
};
},
@@ -325,16 +328,42 @@ export default {
methods: {
init(row) {
console.log("11111", row);
this.dataForm = row || {};
if (row.image != "" && row.image != null) {
if (row.id) {
this.$http
.request({
url: this.$http.adornUrl(this.urlList.info),
method: "POST",
data: {
id: row.id
},
header: {
//默认 无 说明：请求头
"Content-Type": "application/json"
}
})
.then(res => {
console.log("result at line 452:", res);
if (res && res.data.code === 0) {
var data = res.data.course;
console.log("data at line 357:", data);
if (data.image != "" && data.image != null) {
var img = {
name: "",
url: row.image
url: data.image
};
var attr = [];
attr.push(img);
this.fileList = attr;
}
this.dataForm = { ...data };
}
});
} else {
this.dataForm = {};
}
// this.dataForm.id = row.id || 0
// this.dataForm.title = row.title || ''
this.visible = true;

758
src/views/modules/shop/commonBookTags/commonTags1.vue Normal file
View File

@@ -0,0 +1,758 @@
<template>
<div>
<el-drawer
title=""
:with-header="false"
v-if="drawer"
:visible.sync="drawer"
destroy-on-close
direction="rtl"
size="80%"
>
<div
class="shop_drawer_box demo-drawer__content"
v-loading="dataListLoading"
>
<button
@click="close"
aria-label="close drawer"
type="button"
class="el-drawer__close-btn"
>
<i class="el-dialog__close el-icon el-icon-close"></i>
</button>
<!-- <div class="addFormBox">
<el-form ref="addForm" label-width="80px" :model="dataForm">
<el-form-item label="商品名称" prop="title" class="form_item">
<el-input
size="small"
placeholder="请输入商品名称"
style="width: 100%"
v-model="dataForm.key"
clearable
>
</el-input>
</el-form-item>
<el-form-item label="商品类型" prop="goodsType" class="form_item">
<el-select
size="small"
v-model="dataForm.goodsType"
placeholder="请选择"
style="width: 100%"
clearable
>
<el-option
v-for="item in goodsTypeList"
:key="item.dictType"
:label="item.dictValue"
:value="item.dictType"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label=""
class="form_item"
label-width="20px"
style="width: 160px !important"
>
<el-button
@click="
pageIndex = 1;
getDataList(bookMarketId);
"
size="small"
>查询</el-button
>
<el-button @click="handleReset()" size="small">重置</el-button>
</el-form-item>
</el-form>
</div> -->
<div class="addFormBox commonTreeBox" style="overflow: hidden">
<div class="item-box" style="" v-for="(v, i) in appList">
<div class="title_box" slot="center">
<div class="title"><span class="line"></span>{{ v.name }}</div>
</div>
<div class="item-content">
<el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item title="分类标签" :name="v.collapseLabelKey">
<commonTree
source="shop"
sourceType="bookLabelId"
:ref="`commonTree${v.key}`"
:productId="productId"
:dataList="dynamicArray('treeDataList', v.key)"
:urlList="urlList"
@submit="
(ids, sourceType) =>
handleSubmitShop(ids, sourceType, v.key)
"
@delete="
(ids, sourceType) =>
handleDeleteShop(ids, sourceType, v.key)
"
>
</commonTree>
</el-collapse-item>
<el-collapse-item title="营销标签" :name="v.collapseMarketKey">
<commonTreeMarket
source="shop"
sourceType="bookMarketId"
:productId="productId"
:ref="`commonTreeMarket${v.key}`"
:dataList="dynamicArray('treeDataMarketList', v.key)"
:urlList="urlList"
@submit="
(ids, sourceType) =>
handleSubmitShop(ids, sourceType, v.key)
"
@delete="
(ids, sourceType) =>
handleDeleteShop(ids, sourceType, v.key)
"
>
</commonTreeMarket>
</el-collapse-item>
</el-collapse>
</div>
</div>
</div>
<!-- <div class="demo-drawer__footer">
<div style="float: right; margin-top: 20px">
<el-button @click="close" size="small">取 消</el-button>
<el-button
type="primary"
@click="submit"
:loading="loading"
size="small"
>{{ loading ? "提交中 ..." : "确 定" }}</el-button
>
</div>
</div> -->
<!-- 弹窗, 新增 / 修改 -->
<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @showchooseBookf = "showchooseBookf"></add-or-update>
<choose-book v-if="chooseBookVisible" :bookIds = bookIds ref="chooseBook" :chooseBookVisible = chooseBookVisible @closeBookf = "closeBookf"></choose-book> -->
</div>
</el-drawer>
</div>
</template>
<script>
// import chooseBook from './chooseBook.vue'
// import AddOrUpdate from './shopproduct-add-or-update'
import debounce from "lodash/debounce"; //导入lodash中的debounce
import commonTree from "./tags.vue";
import commonTreeMarket from "./tags.vue";
import commonTreeZMZM from "./tags.vue";
export default {
props: ["currentType", "currentId"],
data() {
return {
activeNames: [],
appList: [
{
name: "疯子读书",
key: 1,
collapseLabelKey: 1,
collapseMarketKey: 2,
urlList: {
saveBookShop: "/master/shopProduct/bindProductAndBookLabel",
deleteBookShop: "/master/shopProduct/unbindProductAndBookLabel",
saveBookShopMarket: "/master/shopProduct/bindProductAndBookMarket",
deleteBookShopMarket:
"/master/shopProduct/unbindProductAndBookMarket"
}
},
{
name: "吴门医述",
key: 2,
collapseLabelKey: 3,
collapseMarketKey: 4,
urlList: {
saveBookShop: "/master/shopProduct/bindProductAndMedicineLabel",
deleteBookShop: "/master/shopProduct/unbindProductAndMedicineLabel",
saveBookShopMarket:
"/master/shopProduct/bindProductAndMedicineMarket",
deleteBookShopMarket:
"/master/shopProduct/unbindProductAndMedicineMarket"
}
},
{
name: "众妙之门",
key: 3,
collapseLabelKey: 5,
collapseMarketKey: 6,
urlList: {
saveBookShop: "/master/shopProduct/bindProductAndSociologyLabel",
deleteBookShop:
"/master/shopProduct/unbindProductAndSociologyLabel",
saveBookShopMarket:
"/master/shopProduct/bindProductAndSociologyMarket",
deleteBookShopMarket:
"/master/shopProduct/unbindProductAndSociologyMarket"
}
}
],
productId: null,
drawer: false,
loading: false,
multipleSelectionAll: [], // 所有选中的数据包含跨页数据
multipleSelection: [], // 当前页选中的数据
idKey: "productId", // 标识列表数据中每一行的唯一键的名称(需要按自己的数据改一下)
dataForm: {
key: ""
},
bookMarketId: null,
dataList: [],
treeDataList1: [],
treeDataMarketList1: [],
treeDataList2: [],
treeDataMarketList2: [],
treeDataList3: [],
treeDataMarketList3: [],
publishStatus: false,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false,
chooseBookVisible: false,
bookIds: [],
goodsTypeList: [],
urlList: {
treeList: "/master/shopProduct/getProductToLabel",
treeMarketList: "/book/labelAndMarket/marketTree",
deleteBookShop: "/book/labelAndMarket/delToLable",
deleteBookShopMarket: "/book/labelAndMarket/delToMarket",
saveBookShop: "/book/labelAndMarket/saveToLabel",
saveBookShopMarket: "/book/labelAndMarket/saveToMarket",
getToLabelList: "/book/labelAndMarket/getToLabelList",
getToMarketList: "/book/labelAndMarket/getToMarketList"
}
};
},
components: {
commonTree,
commonTreeMarket,
commonTreeZMZM
// chooseBook
},
async activated() {
// await this.getDataList("treeList");
// await this.getDataList("treeMarketList");
},
methods: {
dynamicArray(type, key) {
console.log("key at line 228:", key);
// 这里可以根据条件返回 this.myArray 或 this.yourArray
var list = [];
if (type == "treeDataList") {
switch (key) {
case 1:
list = this.treeDataList1;
break;
case 2:
list = this.treeDataList2;
break;
case 3:
list = this.treeDataList3;
break;
}
} else if (type == "treeDataMarketList") {
switch (key) {
case 1:
list = this.treeDataMarketList1;
break;
case 2:
list = this.treeDataMarketList2;
break;
case 3:
list = this.treeDataMarketList3;
break;
}
}
console.log("list at line 258:", list, key);
return list;
},
handleChange(val) {
console.log(val);
},
handleSubmitShop: debounce(async function(ids, sourceType, key) {
this.dataListLoading = true;
console.log("🚀 ~ handleSubmitShop ~ ids:", ids);
var url;
var data = { productId: this.productId };
switch (sourceType) {
case "bookLabelId":
url = this.appList[key - 1].urlList.saveBookShop;
data.labelId = ids;
break;
case "bookMarketId":
url = this.appList[key - 1].urlList.saveBookShopMarket;
data.marketId = ids;
break;
}
await this.$http({
url: this.$http.adornUrl(`${url}`),
method: "post",
data: this.$http.adornData(data)
}).then(async ({ data }) => {
if (data && data.code === 0) {
// this.$message.success(data.msg);
} else {
this.$message.error(data.msg);
}
// this.dataListLoading = false;
});
this.$nextTick(async () => {
setTimeout(() => {
this.getDataList();
}, 200);
// await this.$refs[`commonTree${key}`][0].getAssociatedGoodsList(
// this.urlList.getToLabelList,
// "bookLabelId"
// );
// await this.$refs[`commonTreeMarket${key}`][0].getAssociatedGoodsList(
// this.urlList.getToMarketList,
// "bookMarketId"
// );
this.dataListLoading = false;
});
}),
handleDeleteShop: debounce(async function(ids, sourceType, key) {
console.log("key at line 289:", key);
this.dataListLoading = true;
console.log("🚀 ~ handleSubmitShop ~ ids:", ids);
var url;
var data = { productId: this.productId };
switch (sourceType) {
case "bookLabelId":
url = `${this.appList[key - 1].urlList.deleteBookShop}`;
data.labelId = ids;
break;
case "bookMarketId":
url = `${this.appList[key - 1].urlList.deleteBookShopMarket}`;
data.marketId = ids;
break;
}
await this.$http
.request({
url: this.$http.adornUrl(url),
method: "POST",
data: {
...data
},
header: {
//默认 无 说明：请求头
"Content-Type": "application/json"
}
})
.then(async ({ data }) => {
if (data && data.code === 0) {
// this.$message.success(data.msg);
} else {
this.$message.error(data.msg);
}
// this.dataListLoading = false;
});
this.$nextTick(async () => {
setTimeout(() => {
this.getDataList();
}, 200);
// await this.$refs[`commonTree${key}`][0].getAssociatedGoodsList(
// this.urlList.getToLabelList,
// "bookLabelId"
// );
// await this.$refs[`commonTreeMarket${key}`][0].getAssociatedGoodsList(
// this.urlList.getToMarketList,
// "bookMarketId"
// );
this.dataListLoading = false;
});
}),
async getDataList() {
await this.$http({
url: this.$http.adornUrl(`${this.urlList.treeList}`),
method: "post",
data: {
productId: this.productId
}
}).then(({ data }) => {
console.log("🚀 ~ getDataList ~ data:", data);
if (data && data.code === 0) {
var allData = data.data;
this.treeDataList1 = allData.bookLabel;
this.treeDataList2 = allData.medicineLabel;
this.treeDataList3 = allData.sociologyLabel;
// this.treeDataList1.push({});
this.treeDataMarketList1 = allData.bookMarket;
this.treeDataMarketList2 = allData.medicineMarket;
this.treeDataMarketList3 = allData.sociologyMarket;
// this.totalPage = data.page.totalCount
} else {
this.treeDataList1 = [];
this.treeDataList2 = [];
this.treeDataList3 = [];
this.treeDataMarketList1 = [];
this.treeDataMarketList2 = [];
this.treeDataMarketList3 = [];
// this.totalPage = 0
}
});
},
handleReset() {
this.dataForm = {};
this.pageIndex = 1;
this.getDataList();
},
submit() {
var ids = this.multipleSelection.map(e => e.productId).toString(",");
this.$emit("submit", ids);
console.log(
"🚀 ~ submit ~ this.multipleSelection:",
this.multipleSelection
);
},
// 获取商品类型
getGoodsTypeList() {
this.$http({
url: this.$http.adornUrl("/book/sysdictdata/selectByType/goodsType"),
method: "get"
}).then(({ data }) => {
// console.log(data.dataList)
this.goodsTypeList = data.dataList;
});
},
handleClose(done) {
done();
// this.$confirm("确认关闭？")
// .then((_) => {
// done();
// })
// .catch((_) => {});
},
async getTreeList() {
this.dataListLoading = true;
this.$nextTick(async () => {
this.appList.forEach(async e => {
await this.$refs[`commonTree${e.key}`].getAssociatedGoodsList(
this.urlList.getToLabelList,
"bookLabelId"
);
await this.$refs[`commonTreeMarket${e.key}`].getAssociatedGoodsList(
this.urlList.getToMarketList,
"bookMarketId"
);
});
await this.getDataList("treeList");
await this.getDataList("treeMarketList");
this.dataListLoading = false;
});
},
async open(id) {
this.productId = id;
this.drawer = true;
this.dataForm = {};
this.appList.forEach(e => {
this.activeNames.push(e.collapseLabelKey);
this.activeNames.push(e.collapseMarketKey);
});
setTimeout(async () => {
await this.getDataList();
}, 200);
// this.pageIndex = 1;
// await this.getGoodsTypeList();
},
close() {
this.drawer = false;
},
getRowKeys(row) {
return row.productId;
},
handleSelectionChange(val) {
console.log("🚀 ~ handleSelectionChange ~ val:", val);
// table组件选中事件,记得加上@selection-change="handleSelectionChange"
this.multipleSelection = val;
// this.changePageCoreRecordData();
},
closeBookf() {
this.chooseBookVisible = false;
},
showchooseBookf(e) {
// 显示图书列表
this.chooseBookVisible = true;
// console.log(this.bookIds,'this.bookIds')
// this.$nextTick(() => {
// this.$refs.chooseBook.getBookList()
// this.bookIds = e.bookIds
// })
},
// 获取数据列表
// async getDataList() {
// var form = {
// ...this.dataForm,
// current: this.pageIndex,
// limit: this.pageSize,
// productId: "",
// };
// // this.multipleSelection=[]
// if (this.currentType == "bookLabelId") {
// form.bookLabelId = this.currentId;
// console.log("🚀 ~ getAssociatedGoodsList ~ form:", form);
// } else if (this.currentType == "bookMarketId") {
// form.bookMarketId = this.currentId;
// console.log("🚀 ~ getAssociatedGoodsList ~ form:", form);
// }
// this.dataListLoading = true;
// this.clear();
// await this.$http({
// url: this.$http.adornUrl(`/book/labelAndMarket/getNotToLabelList`),
// method: "post",
// data: this.$http.adornData(form),
// }).then(({ data }) => {
// if (data && data.code === 0) {
// this.dataList = data.result.records;
// this.totalPage = data.result.total;
// } else {
// this.dataList = [];
// this.totalPage = 0;
// }
// // setTimeout(async () => {
// // await this.setSelectRow();
// // }, 200);
// this.dataListLoading = false;
// });
// },
clear() {
// this.$refs.table.clearSelection();
this.multipleSelection = [];
},
// 每页数
sizeChangeHandle(val) {
// this.changePageCoreRecordData();
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
// 改变页的时候调用一次
// this.changePageCoreRecordData();
this.pageIndex = val;
this.getDataList();
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
// 新增 / 修改
addOrUpdateHandle(id) {
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id);
});
},
// 删除
deleteHandle(id) {
var ids = id
? [id]
: this.dataListSelections.map(item => {
return item.productId;
});
this.$confirm(
`确定对[id=${ids.join(",")}]进行[${id ? "删除" : "批量删除"}]操作?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
this.$http({
url: this.$http.adornUrl("/book/shopproduct/delete"),
method: "post",
data: this.$http.adornData(ids, false)
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.getDataList();
}
});
} else {
this.$message.error(data.msg);
}
});
});
},
SwitchChange(event) {
/*点击时他会自动把你绑定的值变更，直接去请求数据就可以了*/
var parms = {
publishStatus: event.publishStatus,
productId: event.productId
};
// console.log(parms)
this.$http({
url: this.$http.adornUrl("/book/shopproduct/update"),
method: "post",
data: parms
})
.then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
})
.catch(error => {
this.loading = false;
console.log(error);
});
console.log(event);
}
}
};
</script>
<style lang="less" scoped>
.shop_drawer_box {
padding: 20px !important;
box-sizing: border-box;
width: 100%;
height: 100%;
}
.addFormBox {
width: 100%;
// overflow: hidden;
.form_item {
width: 33%;
float: left;
}
}
::v-deep.el-drawer__header {
margin-bottom: 10px !important;
}
.commonTreeBox {
height: calc(100% - 10px) !important;
padding: 5px;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 5px !important;
}
/deep/.tree_box {
width: 100% !important;
// min-width: 300px;
// background-color: #fff !important;
border: none !important;
border-radius: 10px;
padding: 15px;
padding-left: 0px !important ;
box-sizing: border-box;
.custom-tree-container {
border-radius: 4px !important;
height: calc(100% - 30px);
// border: 1px solid #ebeef5 !important;
// background-color: #fff !important;
overflow: hidden !important;
color: #303133 !important;
// padding: 15px;
transition: 0.3s !important;
}
// background: #fafafa;
}
/deep/.shop_drawer_box {
// padding-top: 0px !important ;
}
.title_box {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
.button_box {
// width: 200px;
float: right;
}
}
.title {
width: 300px;
min-width: 200px;
padding: 20px;
padding-bottom: 0;
float: left;
display: flex;
align-items: center;
font-weight: 600;
font-size: 22px;
// color: #17b3a3;
.line {
width: 4px;
height: 20px;
margin-right: 8px;
background: #17b3a3;
}
}
.el-drawer__close-btn {
position: absolute;
right: 10px;
top: 10px;
}
.item-box {
width: 32%;
height: 100%;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !important;
border: 1px solid #ebeef5 !important;
}
.item-content {
padding: 20px;
padding-top: 0;
overflow-y: auto;
height: calc(100% - 80px);
}
/deep/.el-collapse-item {
margin-bottom: 20px;
.el-collapse-item__header {
background: #17b3a3 !important;
height: 36px !important;
color: #fff;
font-size: 16px;
padding-left: 15px;
}
.el-collapse-item__wrap {
background: #f8f8f8 !important;
.el-tree {
background-color: transparent !important;
}
}
}
/deep/.el-collapse {
border-bottom: none !important;
}
</style>

655
src/views/modules/shop/commonBookTags/correlation.vue Normal file
View File

@@ -0,0 +1,655 @@
<template>
<div>
<el-drawer
title=""
:with-header="false"
v-if="drawer"
:visible.sync="drawer"
destroy-on-close
direction="rtl"
size="80%"
>
<div
class="shop_drawer_box demo-drawer__content"
v-loading="dataListLoading"
>
<button
@click="close"
aria-label="close drawer"
type="button"
class="el-drawer__close-btn"
>
<i class="el-dialog__close el-icon el-icon-close"></i>
</button>
<div class="addFormBox commonTreeBox" style="overflow: hidden">
<div class="item-box" style="">
<!-- <div class="title_box" slot="center">
<div class="title"><span class="line"></span></div>
</div> -->
<div class="item-content">
<el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item title="已关联图书列表" name="1">
<commonOperationsList
ref="commonOperationsBook"
title="图书"
source="book"
>
</commonOperationsList>
</el-collapse-item>
<el-collapse-item title="已关联课程列表" name="2">
<commonOperationsList
ref="commonOperationsCurriculum"
title="课程"
source="curriculum"
></commonOperationsList>
</el-collapse-item>
</el-collapse>
</div>
</div>
</div>
<!-- <div class="demo-drawer__footer">
<div style="float: right; margin-top: 20px">
<el-button @click="close" size="small">取 消</el-button>
<el-button
type="primary"
@click="submit"
:loading="loading"
size="small"
>{{ loading ? "提交中 ..." : "确 定" }}</el-button
>
</div>
</div> -->
<!-- 弹窗, 新增 / 修改 -->
<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @showchooseBookf = "showchooseBookf"></add-or-update>
<choose-book v-if="chooseBookVisible" :bookIds = bookIds ref="chooseBook" :chooseBookVisible = chooseBookVisible @closeBookf = "closeBookf"></choose-book> -->
</div>
</el-drawer>
</div>
</template>
<script>
// import chooseBook from './chooseBook.vue'
// import AddOrUpdate from './shopproduct-add-or-update'
import debounce from "lodash/debounce"; //导入lodash中的debounce
import commonOperationsList from "./operationsList.vue";
export default {
props: ["currentType", "currentId"],
data() {
return {
activeNames: ["1", "2"],
appList: [
{
name: "关联图书",
key: 1,
collapseLabelKey: 1,
collapseMarketKey: 2,
urlList: {}
},
{
name: "关联课程",
key: 2,
collapseLabelKey: 3,
collapseMarketKey: 4,
urlList: {}
},
{
name: "众妙之门",
key: 3,
collapseLabelKey: 5,
collapseMarketKey: 6,
urlList: {}
}
],
productId: null,
drawer: false,
loading: false,
multipleSelectionAll: [], // 所有选中的数据包含跨页数据
multipleSelection: [], // 当前页选中的数据
idKey: "productId", // 标识列表数据中每一行的唯一键的名称(需要按自己的数据改一下)
dataForm: {
key: ""
},
bookMarketId: null,
dataList: [],
treeDataList1: [],
treeDataMarketList1: [],
treeDataList2: [],
treeDataMarketList2: [],
treeDataList3: [],
treeDataMarketList3: [],
publishStatus: false,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false,
chooseBookVisible: false,
bookIds: [],
goodsTypeList: [],
urlList: {
treeList: "/master/shopProduct/getProductToLabel",
treeMarketList: "/book/labelAndMarket/marketTree",
deleteBookShop: "/book/labelAndMarket/delToLable",
deleteBookShopMarket: "/book/labelAndMarket/delToMarket",
saveBookShop: "/book/labelAndMarket/saveToLabel",
saveBookShopMarket: "/book/labelAndMarket/saveToMarket",
getToLabelList: "/book/labelAndMarket/getToLabelList",
getToMarketList: "/book/labelAndMarket/getToMarketList"
}
};
},
components: {
commonOperationsList
// chooseBook
},
async activated() {
// await this.getDataList("treeList");
// await this.getDataList("treeMarketList");
},
methods: {
openTable(type, formName) {
this.$nextTick(() => {
this.$refs[`commonOperationsBook`][0].openTable(formName);
});
},
dynamicArray(type, key) {
console.log("key at line 228:", key);
// 这里可以根据条件返回 this.myArray 或 this.yourArray
var list = [];
if (type == "treeDataList") {
switch (key) {
case 1:
list = this.treeDataList1;
break;
case 2:
list = this.treeDataList2;
break;
case 3:
list = this.treeDataList3;
break;
}
} else if (type == "treeDataMarketList") {
switch (key) {
case 1:
list = this.treeDataMarketList1;
break;
case 2:
list = this.treeDataMarketList2;
break;
case 3:
list = this.treeDataMarketList3;
break;
}
}
console.log("list at line 258:", list, key);
return list;
},
handleChange(val) {
console.log(val);
},
handleSubmitShop: debounce(async function(ids, sourceType, key) {
this.dataListLoading = true;
console.log("🚀 ~ handleSubmitShop ~ ids:", ids);
var url;
var data = { productId: this.productId };
switch (sourceType) {
case "bookLabelId":
url = this.urlList.saveBookShop;
data.bookLabelId = ids;
break;
case "bookMarketId":
url = this.urlList.saveBookShopMarket;
data.bookMarketId = ids;
break;
}
await this.$http({
url: this.$http.adornUrl(`${url}`),
method: "post",
data: this.$http.adornData(data)
}).then(async ({ data }) => {
if (data && data.code === 0) {
// this.$message.success(data.msg);
} else {
this.$message.error(data.msg);
}
// this.dataListLoading = false;
});
this.$nextTick(async () => {
await this.$refs[`commonTree${key}`][0].getAssociatedGoodsList(
this.urlList.getToLabelList,
"bookLabelId"
);
await this.$refs[`commonTreeMarket${key}`][0].getAssociatedGoodsList(
this.urlList.getToMarketList,
"bookMarketId"
);
this.dataListLoading = false;
});
}, 200),
handleDeleteShop: debounce(async function(ids, sourceType, key) {
console.log("key at line 289:", key);
this.dataListLoading = true;
console.log("🚀 ~ handleSubmitShop ~ ids:", ids);
var url;
switch (sourceType) {
case "bookLabelId":
url = `${this.urlList.deleteBookShop}?lableId=${ids}&productId=${
this.productId
}`;
break;
case "bookMarketId":
url = `${
this.urlList.deleteBookShopMarket
}?marketId=${ids}&productId=${this.productId}`;
break;
}
await this.$http({
url: this.$http.adornUrl(url),
method: "post"
}).then(async ({ data }) => {
if (data && data.code === 0) {
// this.$message.success(data.msg);
} else {
this.$message.error(data.msg);
}
// this.dataListLoading = false;
});
this.$nextTick(async () => {
await this.$refs[`commonTree${key}`][0].getAssociatedGoodsList(
this.urlList.getToLabelList,
"bookLabelId"
);
await this.$refs[`commonTreeMarket${key}`][0].getAssociatedGoodsList(
this.urlList.getToMarketList,
"bookMarketId"
);
this.dataListLoading = false;
});
}, 200),
async getDataList(id) {
await this.$http({
url: this.$http.adornUrl(`${this.urlList.treeList}`),
method: "post",
data: {
productId: id
}
}).then(({ data }) => {
console.log("🚀 ~ getDataList ~ data:", data);
if (data && data.code === 0) {
var allData = data.data;
this.treeDataList1 = allData.bookLabel;
this.treeDataList2 = allData.medicineLabel;
this.treeDataList3 = allData.sociologyLabel;
// this.treeDataList1.push({});
this.treeDataMarketList1 = allData.bookMarket;
this.treeDataMarketList2 = allData.medicineMarket;
this.treeDataMarketList3 = allData.sociologyMarket;
// this.totalPage = data.page.totalCount
} else {
this.treeDataList1 = [];
this.treeDataList2 = [];
this.treeDataList3 = [];
this.treeDataMarketList1 = [];
this.treeDataMarketList2 = [];
this.treeDataMarketList3 = [];
// this.totalPage = 0
}
});
},
handleReset() {
this.dataForm = {};
this.pageIndex = 1;
this.getDataList();
},
submit() {
var ids = this.multipleSelection.map(e => e.productId).toString(",");
this.$emit("submit", ids);
console.log(
"🚀 ~ submit ~ this.multipleSelection:",
this.multipleSelection
);
},
// 获取商品类型
getGoodsTypeList() {
this.$http({
url: this.$http.adornUrl("/book/sysdictdata/selectByType/goodsType"),
method: "get"
}).then(({ data }) => {
// console.log(data.dataList)
this.goodsTypeList = data.dataList;
});
},
handleClose(done) {
done();
// this.$confirm("确认关闭？")
// .then((_) => {
// done();
// })
// .catch((_) => {});
},
async getTreeList() {
this.dataListLoading = true;
this.$nextTick(async () => {
this.appList.forEach(async e => {
await this.$refs[`commonTree${e.key}`].getAssociatedGoodsList(
this.urlList.getToLabelList,
"bookLabelId"
);
await this.$refs[`commonTreeMarket${e.key}`].getAssociatedGoodsList(
this.urlList.getToMarketList,
"bookMarketId"
);
});
await this.getDataList("treeList");
await this.getDataList("treeMarketList");
this.dataListLoading = false;
});
},
async open(id) {
this.activeNames = ["1", "2"];
this.productId = id;
this.drawer = true;
this.dataForm = {};
this.appList.forEach(e => {
this.activeNames.push(e.collapseLabelKey);
this.activeNames.push(e.collapseMarketKey);
});
setTimeout(async () => {
await this.getDataList(id);
}, 200);
// this.pageIndex = 1;
// await this.getGoodsTypeList();
},
close() {
this.drawer = false;
},
getRowKeys(row) {
return row.productId;
},
handleSelectionChange(val) {
console.log("🚀 ~ handleSelectionChange ~ val:", val);
// table组件选中事件,记得加上@selection-change="handleSelectionChange"
this.multipleSelection = val;
// this.changePageCoreRecordData();
},
closeBookf() {
this.chooseBookVisible = false;
},
showchooseBookf(e) {
// 显示图书列表
this.chooseBookVisible = true;
// console.log(this.bookIds,'this.bookIds')
// this.$nextTick(() => {
// this.$refs.chooseBook.getBookList()
// this.bookIds = e.bookIds
// })
},
// 获取数据列表
// async getDataList() {
// var form = {
// ...this.dataForm,
// current: this.pageIndex,
// limit: this.pageSize,
// productId: "",
// };
// // this.multipleSelection=[]
// if (this.currentType == "bookLabelId") {
// form.bookLabelId = this.currentId;
// console.log("🚀 ~ getAssociatedGoodsList ~ form:", form);
// } else if (this.currentType == "bookMarketId") {
// form.bookMarketId = this.currentId;
// console.log("🚀 ~ getAssociatedGoodsList ~ form:", form);
// }
// this.dataListLoading = true;
// this.clear();
// await this.$http({
// url: this.$http.adornUrl(`/book/labelAndMarket/getNotToLabelList`),
// method: "post",
// data: this.$http.adornData(form),
// }).then(({ data }) => {
// if (data && data.code === 0) {
// this.dataList = data.result.records;
// this.totalPage = data.result.total;
// } else {
// this.dataList = [];
// this.totalPage = 0;
// }
// // setTimeout(async () => {
// // await this.setSelectRow();
// // }, 200);
// this.dataListLoading = false;
// });
// },
clear() {
// this.$refs.table.clearSelection();
this.multipleSelection = [];
},
// 每页数
sizeChangeHandle(val) {
// this.changePageCoreRecordData();
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
// 改变页的时候调用一次
// this.changePageCoreRecordData();
this.pageIndex = val;
this.getDataList();
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
// 新增 / 修改
addOrUpdateHandle(id) {
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id);
});
},
// 删除
deleteHandle(id) {
var ids = id
? [id]
: this.dataListSelections.map(item => {
return item.productId;
});
this.$confirm(
`确定对[id=${ids.join(",")}]进行[${id ? "删除" : "批量删除"}]操作?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
this.$http({
url: this.$http.adornUrl("/book/shopproduct/delete"),
method: "post",
data: this.$http.adornData(ids, false)
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.getDataList();
}
});
} else {
this.$message.error(data.msg);
}
});
});
},
SwitchChange(event) {
/*点击时他会自动把你绑定的值变更，直接去请求数据就可以了*/
var parms = {
publishStatus: event.publishStatus,
productId: event.productId
};
// console.log(parms)
this.$http({
url: this.$http.adornUrl("/book/shopproduct/update"),
method: "post",
data: parms
})
.then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
})
.catch(error => {
this.loading = false;
console.log(error);
});
console.log(event);
}
}
};
</script>
<style lang="less" scoped>
.shop_drawer_box {
padding: 20px !important;
box-sizing: border-box;
width: 100%;
height: 100%;
}
.addFormBox {
width: 100%;
// overflow: hidden;
.form_item {
width: 33%;
float: left;
}
}
::v-deep.el-drawer__header {
margin-bottom: 10px !important;
}
.commonTreeBox {
height: calc(100% - 10px) !important;
padding: 5px;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 5px !important;
}
/deep/.tree_box {
width: 100% !important;
// min-width: 300px;
// background-color: #fff !important;
border: none !important;
border-radius: 10px;
padding: 15px;
padding-left: 0px !important ;
box-sizing: border-box;
.custom-tree-container {
border-radius: 4px !important;
height: calc(100% - 30px);
// border: 1px solid #ebeef5 !important;
// background-color: #fff !important;
overflow: hidden !important;
color: #303133 !important;
// padding: 15px;
transition: 0.3s !important;
}
// background: #fafafa;
}
/deep/.shop_drawer_box {
// padding-top: 0px !important ;
}
.title_box {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
.button_box {
// width: 200px;
float: right;
}
}
.title {
width: 300px;
min-width: 200px;
padding: 20px;
padding-bottom: 0;
float: left;
display: flex;
align-items: center;
font-weight: 600;
font-size: 22px;
// color: #17b3a3;
.line {
width: 4px;
height: 20px;
margin-right: 8px;
background: #17b3a3;
}
}
.el-drawer__close-btn {
position: absolute;
right: 10px;
top: 10px;
}
.item-box {
width: 100%;
height: 100%;
// box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !important;
// border: 1px solid #ebeef5 !important;
}
.item-content {
padding: 20px;
padding-top: 0;
overflow-y: auto;
height: calc(100% - 80px);
}
/deep/.el-collapse-item {
margin-bottom: 20px;
.el-collapse-item__header {
background: #17b3a3 !important;
height: 36px !important;
color: #fff;
font-size: 16px;
padding-left: 15px;
}
.el-collapse-item__wrap {
// background: #f8f8f8 !important;
border-bottom: none !important;
.el-tree {
background-color: transparent !important;
}
}
}
/deep/.el-collapse {
border-bottom: none !important;
}
</style>

1252
src/views/modules/shop/commonBookTags/operationsList.vue Normal file
View File

File diff suppressed because it is too large Load Diff

191
src/views/modules/shop/commonBookTags/tags.vue
View File

@@ -1,13 +1,21 @@
<template>
<div class="tree_box">
<div style="overflow: hidden" v-if="source == 'tags'">
<p class="info_bg" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis">
<p
class="info_bg"
style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis"
>
当前标签：<span style="color: #17b3a3; font-weight: 600">{{
currentNode ? currentNode.data.title : ""
}}</span>
</p>
<el-button type="primary" @click="addOrUpdateHandle()" style="float: right" size="mini">新增顶级标签</el-button>
<el-button
type="primary"
@click="addOrUpdateHandle()"
style="float: right"
size="mini"
>新增顶级标签</el-button
>
</div>
<!-- <p v-if="source == 'shop'" class="select_box" style="">
<el-checkbox
@@ -26,24 +34,48 @@
<!-- show-checkbox -->
<!-- :allow-drop="allowDrop" -->
<div class="custom-tree-container">
<el-tree :highlight-current="true" class="filter-tree" node-key="id" :data="treeDataList" :props="defaultProps"
default-expand-all :filter-node-method="filterNode" ref="tree" :draggable="true" @node-click="handleNodeClick"
:expand-on-click-node="false">
<el-tree
:highlight-current="true"
class="filter-tree"
node-key="id"
:data="treeDataList"
:props="defaultProps"
default-expand-all
:filter-node-method="filterNode"
ref="tree"
:draggable="true"
@node-click="handleNodeClick"
:expand-on-click-node="false"
>
<!-- @click="handleClickNodes(node, data)" -->
<span class="custom-tree-node" slot-scope="{ node, data }" @click="
source == 'tags'
? handleClickNodes(node, data, 'edit')
: ''
" :class="`${currentNode&&currentNode.data.id==data.id?'isSelect':''}`" style=" padding-left: 5px;
box-sizing: border-box;">
<span
class="custom-tree-node"
slot-scope="{ node, data }"
@click="source == 'tags' ? handleClickNodes(node, data, 'edit') : ''"
:class="
`${currentNode && currentNode.data.id == data.id ? 'isSelect' : ''}`
"
style=" padding-left: 5px;
box-sizing: border-box;"
>
<!-- @change="(e) => selectShop(data, e)" -->
<span style="display: flex; align-items: center" ><el-checkbox @change=" selectShop(data)"
:value="selectArr.includes(data.id)" v-if="data.isLast == 1 && source == 'shop'"
style="margin-right: 10px"></el-checkbox>{{ node.label }}</span>
<span style="display: flex; align-items: center"
><el-checkbox
@change="selectShop(data)"
:value="data.select"
v-if="data.isLast == 1 && source == 'shop'"
style="margin-right: 10px"
></el-checkbox
>{{ node.label }}</span
>
<span v-if="source == 'tags'">
<!-- v-if="node.level <= 1" -->
<el-button type="text" size="mini" @click.stop="handleClickNodes(node, data, 'addChildren')"
v-if="data.isLast != 1">
<el-button
type="text"
size="mini"
@click.stop="handleClickNodes(node, data, 'addChildren')"
v-if="data.isLast != 1"
>
添加下级
</el-button>
<!-- <el-button
@@ -55,7 +87,12 @@
</el-button> -->
<!-- v-if="node.childNodes.length == 0" -->
<el-button type="text" size="mini" @click.stop="remove(data)" style="color: rgb(235 92 92);">
<el-button
type="text"
size="mini"
@click.stop="remove(data)"
style="color: rgb(235 92 92);"
>
删除
</el-button>
</span>
@@ -69,7 +106,7 @@
// import dialogComponent from './seckillprodrelation'
import debounce from "lodash/debounce"; //导入lodash中的debounce
export default {
props: ["dataList", "urlList", "source", "productId", 'sourceType'],
props: ["dataList", "urlList", "source", "productId", "sourceType"],
data() {
return {
currentNode: null,
@@ -78,8 +115,8 @@ export default {
selectArr: [],
defaultProps: {
children: "children",
label: "title",
},
label: "title"
}
};
},
components: {},
@@ -97,7 +134,7 @@ export default {
filterText(val) {
this.$refs.tree.filter(val);
},
}
},
activated() {
console.log("🚀 ~ activated ~ this.currentNode:", this.currentNode, "9999");
@@ -128,17 +165,17 @@ export default {
limit: 99999999,
// productName: "",
productId: this.productId,
...form,
...form
// bookLabelId: bookLabelId,
}),
})
}).then(async ({ data }) => {
if (data && data.code === 0) {
if (idType == "bookLabelId") {
this.selectArr = data.result.records.map((e) => {
this.selectArr = data.result.records.map(e => {
return e.bookLabelId;
});
} else if (idType == "bookMarketId") {
this.selectArr = data.result.records.map((e) => {
this.selectArr = data.result.records.map(e => {
return e.bookMarketId;
});
}
@@ -181,19 +218,9 @@ export default {
},
selectShop: debounce(async function(v, status) {
console.log("🚀 ~ selectShop ~ status:", status);
// if (this.selectArr.includes(v.id)) {
// // this.selectArr = this.selectArr.filter(function (item) {
// // return item !== v.id;
// // });
// } else {
// // this.selectArr.push(v.id);
// }
console.log("🚀 ~ selectShop ~ v:", v);
console.log("🚀 ~ selectShop ~ this.selectShopArr999:", this.selectArr);
if (this.selectArr.includes(v.id)) {
if (v.select) {
this.$emit("delete", v.id, this.sourceType);
} else {
this.$emit("submit", v.id, this.sourceType);
@@ -209,25 +236,28 @@ export default {
// this.$forceUpdate();
// },
async setCurrentNodeShow(id) {
console.log("🚀 ~ setCurrentNodeShow ~ id222:", id, this.currentNode)
console.log("🚀 ~ setCurrentNodeShow ~ id222:", id, this.currentNode);
var newNodeData = {}
var newNodeData = {};
if (id) {
newNodeData = await this.$refs.tree.getNode(id);
} else {
newNodeData = {
data: {}
}
};
}
this.currentNode = newNodeData;
this.$forceUpdate();
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(id);
this.$refs.tree.setCheckedKeys([id]);
})
await this.$emit("handleClickNodes", newNodeData, newNodeData.data, "edit");
});
await this.$emit(
"handleClickNodes",
newNodeData,
newNodeData.data,
"edit"
);
},
allowDrop(draggingNode, dropNode, type) {
console.log(draggingNode.level, dropNode.level);
@@ -242,7 +272,7 @@ export default {
async correlationShop(bookLabelId) {
var status;
var productId = this.$refs.commonShop.multipleSelection.map(
(e) => e.productId
e => e.productId
);
console.log("🚀 ~ correlationShop ~ productId:", productId);
await this.$http({
@@ -250,8 +280,8 @@ export default {
method: "post",
data: this.$http.adornData({
productId: productId.toString(","),
bookLabelId: bookLabelId,
}),
bookLabelId: bookLabelId
})
}).then(async ({ data }) => {
if (data && data.code === 0) {
status = true;
@@ -269,14 +299,14 @@ export default {
this.$message.error("请输入标签名称");
return false;
}
await this.$refs[formName].validate(async (valid) => {
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,
}),
...this.addForm
})
}).then(async ({ data }) => {
if (data && data.code === 0) {
var status = await this.correlationShop(data.result.id);
@@ -305,7 +335,7 @@ export default {
// this.addForm={}
// this.$emit("refreshDataList");
},
}
});
}
} else {
@@ -324,14 +354,20 @@ export default {
this.isFresh = true;
},
async handleClickNodes(node, data, type) {
console.log("🚀 ~ handleClickNodes11111 ~ node, data, type:", node, data, type)
console.log(
"🚀 ~ handleClickNodes11111 ~ node, data, type:",
node,
data,
type
);
this.addForm = {};
// console.log(this.$refs.tree.handleClickNodes(), "当前选中节点");
console.log(node, data, "当前选中节点");
this.currentNode = node;
this.isFresh = false;
this.isFresh = true;
this.$forceUpdate()
this.$forceUpdate();
var form = {};
if (this.source == "shop") {
@@ -351,7 +387,7 @@ export default {
isLast: 0,
pid: data.id,
sort: 0,
title: "",
title: ""
};
break;
}
@@ -371,14 +407,13 @@ export default {
}
},
addOrUpdateHandle() {
var addform = {
children: [],
delFlag: 0,
isLast: 0,
pid: 0,
sort: 0,
title: "",
title: ""
};
this.handleClickNodes({ data: addform }, addform, "add");
// if (!this.currentNode) {
@@ -392,24 +427,24 @@ export default {
this.$confirm(`是否删除标签【${data.title}】？`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
type: "warning"
})
.then(async () => {
that.$http({
that
.$http({
url: that.$http.adornUrl(`${that.urlList.delete}?id=` + data.id),
method: "post",
data: {},
}).then(async ({ data }) => {
data: {}
})
.then(async ({ data }) => {
if (data && data.code === 0) {
that.$message({
type: "success",
message: "删除成功!",
message: "删除成功!"
});
} else {
this.$message.error(data.msg);
return false
return false;
}
that.currentNode = null;
@@ -522,10 +557,10 @@ export default {
const children = parent.data.nodes || parent.data;
//若parent.data是对象，操作的是子级；如果是数组，操作的是最外层
if (Array.isArray(parent.data)) {
const parentIndex = parent.data.findIndex((d) => d.id === data.id);
const parentIndex = parent.data.findIndex(d => d.id === data.id);
parent.data.splice(parentIndex, 1);
} else {
const childIndex = children.findIndex((d) => d.id === data.id);
const childIndex = children.findIndex(d => d.id === data.id);
children.splice(childIndex, 1);
}
this.curNode = undefined;
@@ -546,7 +581,7 @@ export default {
return;
}
let id = ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
let id = ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
(
c ^
(crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
@@ -558,7 +593,7 @@ export default {
nodes: [],
id: id,
typeName: "模板组",
temporaryData: "1", //用来区分临时数据
temporaryData: "1" //用来区分临时数据
};
/* 如果模版深度最多两层，以下条件改成该部分注释
this.curNode && this.curNode.depth == 1
@@ -658,7 +693,7 @@ export default {
this.isUpdateGroup = false;
const parent = node.parent;
const children = parent.data.nodes || parent.data;
const index = children.findIndex((d) => d.id === data.id);
const index = children.findIndex(d => d.id === data.id);
let temp = data;
temp.text = this.isactTitle;
children.splice(index, 1, temp);
@@ -678,7 +713,7 @@ export default {
this.dataListLoading = true;
await this.$http({
url: this.$http.adornUrl("/book/labelAndMarket/labelTree"),
method: "get",
method: "get"
// params: this.$http.adornParams({
// 'page': this.pageIndex,
// 'limit': this.pageSize,
@@ -710,7 +745,7 @@ export default {
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
}
// // 新增 / 修改
// addOrUpdateHandle(row) {
// this.addOrUpdateVisible = true;
@@ -718,11 +753,15 @@ export default {
// this.$refs.addOrUpdate.init(row);
// });
// },
},
}
};
</script>
<style lang="less" scoped>
/deep/ .filter-tree .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
/deep/
.filter-tree
.el-tree--highlight-current
.el-tree-node.is-current
> .el-tree-node__content {
// 设置颜色
// background-color: #baf !important;
}
@@ -732,12 +771,13 @@ export default {
// color: #17b3a3 !important;
}
/deep/.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
/deep/.el-tree--highlight-current
.el-tree-node.is-current
> .el-tree-node__content {
background-color: transparent !important;
// color: #17b3a3 !important;
}
/deep/.filter-tree .el-tree-node__content .el-button {
display: inline-block !important;
}
@@ -921,7 +961,6 @@ p {
background-color: unset;
}
.isSelect {
/* 自定义角度渐变 */
background-image: linear-gradient(-45deg, #fff, #b0f3ec);
}

5
src/views/modules/shop/curriculum.vue
View File

@@ -443,11 +443,6 @@ export default {
}
})
// this.$http({
// url: this.$http.adornUrl(`/master/shopProduct/getProductDetail/${this.dataForm.productId}`),
// method: 'get',
// params: this.$http.adornParams()
// })
.then(res => {
console.log("result at line 452:", res);

654
src/views/modules/shop/shopproduct-add-or-update.vue
View File

@@ -1,39 +1,63 @@
<template>
<el-dialog :title="!dataForm.productId ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible"
@close="handlereset" lock-scroll width="750px">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="100px">
<el-dialog
:title="!dataForm.productId ? '新增' : '修改'"
:close-on-click-modal="false"
:visible.sync="visible"
@close="handlereset"
lock-scroll
width="750px"
>
<el-form
:model="dataForm"
:rules="dataRule"
ref="dataForm"
label-width="100px"
>
<el-form-item label="所属分类" prop="poids">
<el-cascader v-model="dataForm.poids" :options="categorys" :props="props" clearable></el-cascader>
<el-cascader
v-model="dataForm.poids"
:options="categorys"
:props="props"
clearable
></el-cascader>
</el-form-item>
<el-form-item label="商品类型" prop="goodsType">
<el-select v-model="dataForm.goodsType" placeholder="请选择">
<el-option v-for="item in goodsTypeList" :key="item.dictType" :label="item.dictValue" :value="item.dictType">
<el-option
v-for="item in goodsTypeList"
:key="item.dictType"
:label="item.dictValue"
:value="item.dictType"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="商品名称" prop="productName">
<el-input v-model="dataForm.productName" placeholder="商品名称"></el-input>
<el-input
v-model="dataForm.productName"
placeholder="商品名称"
></el-input>
</el-form-item>
<el-form-item label="商品标签" prop="tags">
<el-checkbox-group v-model="dataForm.tags" @change="handleCheckedCitiesChange">
<el-checkbox v-for="item in tagList" :label="item.splId" :key="item.splId">{{item.labelName}}</el-checkbox>
<el-checkbox-group
v-model="dataForm.tags"
@change="handleCheckedCitiesChange"
>
<el-checkbox
v-for="item in tagList"
:label="item.splId"
:key="item.splId"
>{{ item.labelName }}</el-checkbox
>
</el-checkbox-group>
</el-form-item>
<!-- 关联的图书ids -->
<el-form-item label="关联图书" prop="Books">
<el-table
:data="dataForm.Books"
stripe
style="width: 100%">
<el-table-column
prop="name" label="图书名" >
</el-table-column>
<el-table-column
prop="images"
label="封面图"
>
<el-table :data="dataForm.Books" stripe style="width: 100%">
<el-table-column prop="name" label="图书名"> </el-table-column>
<el-table-column prop="images" label="封面图">
<template slot-scope="scope">
<img :src="scope.row.images" width="100" height="100">
<img :src="scope.row.images" width="100" height="100" />
</template>
</el-table-column>
<!-- <el-table-column
@@ -43,52 +67,112 @@
</el-table-column> -->
<el-table-column width="180">
<template slot-scope="scope">
<el-button type="danger" @click="deliteBook(scope.$index)">删除</el-button>
<el-button type="danger" @click.native="deliteBook(scope.$index)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<div style="text-align: center;">
<el-button type="primary" size="mini" plain @click="showChooseBook">添加</el-button>
<el-button
type="primary"
size="mini"
plain
@click.native="showChooseBook"
>添加</el-button
>
</div>
</el-form-item>
<el-form-item label="商品图" prop="productImages">
<el-upload :limit="dataForm.limitCountImg" class="el-uploadfeng "
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
:file-list="fileList" :on-success="handlePicSuccess" accept=".jpeg,.jpg,.gif,.png" :on-remove="handleRemove">
<el-upload
:limit="dataForm.limitCountImg"
class="el-uploadfeng "
:class="{
uoloadSty: dataForm.showBtnDealImg,
disUoloadSty: dataForm.noneBtnImg
}"
:action="baseUrl + '/oss/fileoss'"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:file-list="fileList"
:on-success="handlePicSuccess"
accept=".jpeg,.jpg,.gif,.png"
:on-remove="handleRemove"
>
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img width="100%" :src="dataForm.productImages" alt="">
<img width="100%" :src="dataForm.productImages" alt="" />
</el-dialog>
</el-form-item>
<el-form-item label="商品轮播图" prop="productImageList">
<el-upload :limit="5" class="el-uploadfeng noneBtnImg"
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
:file-list="swiperfileList" :on-success="bannerHandlePicSuccess" accept=".jpeg,.jpg,.gif,.png"
:on-remove="bannerHandleRemove">
<el-upload
:limit="5"
class="el-uploadfeng noneBtnImg"
:class="{
uoloadSty: dataForm.showBtnDealImg,
disUoloadSty: dataForm.noneBtnImg
}"
:action="baseUrl + '/oss/fileoss'"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:file-list="swiperfileList"
:on-success="bannerHandlePicSuccess"
accept=".jpeg,.jpg,.gif,.png"
:on-remove="bannerHandleRemove"
>
<i class="el-icon-plus"></i>
</el-upload>
<!-- <el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img width="100%" :src="dataForm.productImageList" alt="">
</el-dialog> -->
<span>图片尺寸：600*600px，支持图片类型：.jpeg,.jpg,.gif,.png， 最多上传5张图片</span>
<span
>图片尺寸：600*600px，支持图片类型：.jpeg,.jpg,.gif,.png，
最多上传5张图片</span
>
</el-form-item>
<div>
<el-form-item label="商品价格" prop="price" style="width: 50%; float: left;">
<el-form-item
label="商品价格"
prop="price"
style="width: 50%; float: left;"
>
<el-input v-model="dataForm.price" placeholder="活动价"></el-input>
</el-form-item>
<el-form-item label="活动价" prop="hDprice" style="width: 50%; float: left;">
<el-input v-model="dataForm.hDprice" placeholder="商品价格"></el-input>
<el-form-item
label="活动价"
prop="hDprice"
style="width: 50%; float: left;"
>
<el-input
v-model="dataForm.hDprice"
placeholder="商品价格"
></el-input>
<span style="color: #999;">值为0或者不填，则没有活动价格</span>
</el-form-item>
<el-form-item label="商品重量" prop="weight" style="width: 50%; float: right;">
<el-input style="width: 80%;" v-model="dataForm.weight" placeholder="商品重量"></el-input><span
style="display: inline-block; float: right; width: 10%;">克</span>
<el-form-item
label="商品重量"
prop="weight"
style="width: 50%; float: right;"
>
<el-input
style="width: 80%;"
v-model="dataForm.weight"
placeholder="商品重量"
></el-input
><span style="display: inline-block; float: right; width: 10%;"
>克</span
>
</el-form-item>
<el-form-item label="商品库存" prop="productStock" style="width: 50%; float: right;">
<el-input v-model="dataForm.productStock" placeholder="商品库存"></el-input>
<el-form-item
label="商品库存"
prop="productStock"
style="width: 50%; float: right;"
>
<el-input
v-model="dataForm.productStock"
placeholder="商品库存"
></el-input>
</el-form-item>
</div>
<!-- <el-form-item label="上架状态" prop="publishStatus">
@@ -142,11 +226,23 @@
</el-form-item>
</div>
<el-form-item label="商品详情" prop="productDetails">
<el-upload class="avatar-uploader" :action="baseUrl + '/oss/fileoss'" accept=".jpeg,.jpg,.gif,.png" :show-file-list="false" :on-success="contentUploadSuccess" >
<el-upload
class="avatar-uploader"
:action="baseUrl + '/oss/fileoss'"
accept=".jpeg,.jpg,.gif,.png"
:show-file-list="false"
:on-success="contentUploadSuccess"
>
</el-upload>
<quill-editor v-model="dataForm.productDetails" ref="myQuillEditor" :options="editorOption"
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
@ready="onEditorReady($event)" class="shangpin_editor">
<quill-editor
v-model="dataForm.productDetails"
ref="myQuillEditor"
:options="editorOption"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@ready="onEditorReady($event)"
class="shangpin_editor"
>
</quill-editor>
</el-form-item>
<!-- <el-form-item label="排序" prop="sort">
@@ -161,30 +257,39 @@
</template>
<script>
import {
quillEditor
} from 'vue-quill-editor'
import global from '../../common/common.vue' //引入共用组间
import { quillEditor } from "vue-quill-editor";
import global from "../../common/common.vue"; //引入共用组间
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
const toolbarOptions = [
['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
['blockquote', 'code-block'], //引用，代码块
[{ 'header': 1 }, { 'header': 2 }], // 几级标题
[{ 'list': 'ordered' }, { 'list': 'bullet' }], // 有序列表，无序列表
[{ 'script': 'sub' }, { 'script': 'super' }], // 下角标，上角标
[{ 'indent': '-1' }, { 'indent': '+1' }], // 缩进
[{ 'direction': 'rtl' }], // 文字输入方向
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小
[{ 'header': [1, 2, 3, 4, 5, 6, false] }],// 标题
[{ 'color': [] }, { 'background': [] }], // 颜色选择
[{ 'font': ['SimSun', 'SimHei', 'Microsoft-YaHei', 'KaiTi', 'FangSong', 'Arial'] }],// 字体
[{ 'align': [] }], // 居中
['clean'], // 清除样式,
['link', 'image'], // 上传图片、上传视频
["bold", "italic", "underline", "strike"], // 加粗，斜体，下划线，删除线
["blockquote", "code-block"], //引用，代码块
[{ header: 1 }, { header: 2 }], // 几级标题
[{ list: "ordered" }, { list: "bullet" }], // 有序列表，无序列表
[{ script: "sub" }, { script: "super" }], // 下角标，上角标
[{ indent: "-1" }, { indent: "+1" }], // 缩进
[{ direction: "rtl" }], // 文字输入方向
[{ size: ["small", false, "large", "huge"] }], // 字体大小
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
[{ color: [] }, { background: [] }], // 颜色选择
[
{
font: [
"SimSun",
"SimHei",
"Microsoft-YaHei",
"KaiTi",
"FangSong",
"Arial"
]
}
], // 字体
[{ align: [] }], // 居中
["clean"], // 清除样式,
["link", "image"] // 上传图片、上传视频
];
export default {
data() {
@@ -208,77 +313,90 @@
hDprice: 0, // 活动价
productId: 0,
limitCountImg: 1, // 图片数量
productImageList: '', // 轮播图
productImageList: "", // 轮播图
showBtnDealImg: true,
noneBtnImg: false,
productName: '',
productName: "",
productStock: null, // 商品库存
price: '',
author: '',
publisher: '',
weight: '',
pubDate: '',
price: "",
author: "",
publisher: "",
weight: "",
pubDate: "",
// format: '', // 开本
isFreeMail: 1, // 是否包邮
// pageNum: '',
// quality: '', // 内文用纸
isNew: 0,
sumSales: null, // 总销量
publishStatus: '',
productPid: '',
productImages: '',
createTime: '',
updateTime: '',
delFlag: '',
sort: '',
goodsType: '', // 商品类型
publishStatus: "",
productPid: "",
productImages: "",
createTime: "",
updateTime: "",
delFlag: "",
sort: "",
goodsType: "", // 商品类型
poids: [],
Books: [] // 关联的图书
},
bookidsd: [],
dataRule: {
productName: [{
productName: [
{
required: true,
message: '商品名称不能为空',
trigger: 'blur'
}],
price: [{
message: "商品名称不能为空",
trigger: "blur"
}
],
price: [
{
required: true,
message: '商品价格不能为空',
trigger: 'blur'
}],
weight: [{
message: "商品价格不能为空",
trigger: "blur"
}
],
weight: [
{
required: true,
message: '商品重量不能为空',
trigger: 'blur'
}],
goodsType: [{
message: "商品重量不能为空",
trigger: "blur"
}
],
goodsType: [
{
required: true,
message: '商品类型不能为空',
trigger: 'blur'
}],
poids: [{
message: "商品类型不能为空",
trigger: "blur"
}
],
poids: [
{
required: true,
message: '商品父id不能为空',
trigger: 'blur'
}],
productImages: [{
message: "商品父id不能为空",
trigger: "blur"
}
],
productImages: [
{
required: true,
message: '商品图不能为空',
trigger: 'blur'
}],
message: "商品图不能为空",
trigger: "blur"
}
],
// productDetails: [{
// required: true,
// message: '商品详情不能为空',
// trigger: 'blur'
// }],
productStock: [{
productStock: [
{
required: true,
message: '商品库存不能为空',
trigger: 'blur'
}],
message: "商品库存不能为空",
trigger: "blur"
}
]
// updateTime: [
// { required: true, message: '更新时间不能为空', trigger: 'blur' }
// ],
@@ -303,41 +421,39 @@
image: function(value) {
if (value) {
// 调用element的图片上传组件
document.querySelector('.avatar-uploader input').click()
document.querySelector(".avatar-uploader input").click();
} else {
this.quill.format('image', false)
this.quill.format("image", false);
}
}
}
}
},
},
placeholder: '请输入正文',
placeholder: "请输入正文"
},
tagList: []
}
};
},
created() {
this.getTreeList()
this.getTags()
this.getTreeList();
this.getTags();
},
methods: {
contentUploadSuccess(res, file) {
// console.log(res)
let quill = this.$refs.myQuillEditor.quill
let quill = this.$refs.myQuillEditor.quill;
// 如果上传成功
if (res) {
// 获取光标所在位置
let length = quill.getSelection().index;
// 插入图片，res为服务器返回的图片链接地址
quill.insertEmbed(length, 'image', res.url)
quill.insertEmbed(length, "image", res.url);
// 调整光标到最后
quill.setSelection(length + 1)
quill.setSelection(length + 1);
} else {
// 提示信息，需引入Message
this.$message.error('图片插入失败！')
this.$message.error("图片插入失败！");
}
},
handleCheckedCitiesChange(value) {
// console.log(value, 'value')
@@ -345,217 +461,221 @@
// 获取商品标签
getTags() {
this.$http({
url: this.$http.adornUrl('/book/label/getLabels'),
method: 'post'
url: this.$http.adornUrl("/book/label/getLabels"),
method: "post"
}).then(({ data }) => {
if (data && data.code === 0) {
this.tagList = data.result.labels
this.tagList = data.result.labels;
// this.totalPage = data.page.totalCount
} else {
this.tagList = []
this.tagList = [];
// this.totalPage = 0
}
})
});
},
showChooseBook() {
// 显示图书列表
this.$emit("showchooseBookf", { 'bookIds': this.dataForm.Books });
this.$emit("showchooseBookf", { bookIds: this.dataForm.Books });
// console.log('发送指令')
this.$bus.$emit("showchooseBook", { 'bookIds': this.dataForm.Books });
this.$bus.$emit("showchooseBook", { bookIds: this.dataForm.Books });
},
init(id) {
this.dataForm.productId = id || 0
this.visible = true
this.getTags()
this.dataForm.productId = id || 0;
this.visible = true;
this.getTags();
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
this.$refs["dataForm"].resetFields();
if (this.dataForm.productId) {
this.$http({
url: this.$http.adornUrl(`/book/shopproduct/info/${this.dataForm.productId}`),
method: 'get',
url: this.$http.adornUrl(
`/book/shopproduct/info/${this.dataForm.productId}`
),
method: "get",
params: this.$http.adornParams()
}).then(({
data
}) => {
}).then(({ data }) => {
if (data && data.code === 0) {
this.dataForm.tags = data.labels
this.dataForm.tags = data.labels;
// console.log('收到的值', this.dataForm.tags)
this.dataForm.productName = data.shopProduct.productName
this.dataForm.price = data.shopProduct.price
this.dataForm.goodsType = data.shopProduct.goodsType
this.dataForm.weight = data.shopProduct.weight
this.dataForm.publishStatus = data.shopProduct.publishStatus
this.dataForm.productPid = data.shopProduct.productPid
this.dataForm.productImages = data.shopProduct.productImages
this.dataForm.createTime = data.shopProduct.createTime
this.dataForm.updateTime = data.shopProduct.updateTime
this.dataForm.delFlag = data.shopProduct.delFlag
this.dataForm.sort = data.shopProduct.sort
this.dataForm.publisher = data.shopProduct.publisher
this.dataForm.author = data.shopProduct.author
this.dataForm.pubDate = data.shopProduct.pubDate
this.dataForm.productName = data.shopProduct.productName;
this.dataForm.price = data.shopProduct.price;
this.dataForm.goodsType = data.shopProduct.goodsType;
this.dataForm.weight = data.shopProduct.weight;
this.dataForm.publishStatus = data.shopProduct.publishStatus;
this.dataForm.productPid = data.shopProduct.productPid;
this.dataForm.productImages = data.shopProduct.productImages;
this.dataForm.createTime = data.shopProduct.createTime;
this.dataForm.updateTime = data.shopProduct.updateTime;
this.dataForm.delFlag = data.shopProduct.delFlag;
this.dataForm.sort = data.shopProduct.sort;
this.dataForm.publisher = data.shopProduct.publisher;
this.dataForm.author = data.shopProduct.author;
this.dataForm.pubDate = data.shopProduct.pubDate;
// this.dataForm.pageNum = data.shopProduct.pageNum
// this.dataForm.quality = data.shopProduct.quality
// this.dataForm.format = data.shopProduct.format
this.dataForm.isFreeMail = data.shopProduct.isFreeMail
this.dataForm.isNew = data.shopProduct.isNew
this.dataForm.productDetails = data.shopProduct.productDetails
this.dataForm.poids = data.shopProduct.poids
this.dataForm.productStock = data.shopProduct.productStock
this.dataForm.hDprice = data.shopProduct.activityPrice
let arrArr = []
this.dataForm.isFreeMail = data.shopProduct.isFreeMail;
this.dataForm.isNew = data.shopProduct.isNew;
this.dataForm.productDetails = data.shopProduct.productDetails;
this.dataForm.poids = data.shopProduct.poids;
this.dataForm.productStock = data.shopProduct.productStock;
this.dataForm.hDprice = data.shopProduct.activityPrice;
let arrArr = [];
if (data.shopProduct.bookidsimages !== '') {
this.dataForm.Books = data.shopProduct.bookidsimages
if (data.shopProduct.bookidsimages !== "") {
this.dataForm.Books = data.shopProduct.bookidsimages;
}
sessionStorage.setItem('Books', JSON.stringify(this.dataForm.Books))
sessionStorage.setItem(
"Books",
JSON.stringify(this.dataForm.Books)
);
if (data.shopProduct.productImages != "") {
var img = {
name: '',
name: "",
url: data.shopProduct.productImages
}
var attr = []
attr.push(img)
this.fileList = attr
};
var attr = [];
attr.push(img);
this.fileList = attr;
}
if (data.shopProduct.productImageList == null || data.shopProduct.productImageList[0] == '' ||
data.shopProduct.productImageList == "") {
this.swiperfileList = []
if (
data.shopProduct.productImageList == null ||
data.shopProduct.productImageList[0] == "" ||
data.shopProduct.productImageList == ""
) {
this.swiperfileList = [];
// console.log('走这')
} else {
// 有轮播图
// console.log(data.shopProduct.productImageList)
let arr = []
let arr1 = []
let arr = [];
let arr1 = [];
arr = data.shopProduct.productImageList.split(',');
arr = data.shopProduct.productImageList.split(",");
// console.log(arr, '处理后得轮播图数组')
arr.forEach((item, index) => {
arr1.push({
name: index,
url: item
})
});
this.swiperfileList = arr1
});
this.swiperfileList = arr1;
}
}
})
});
}
})
});
},
// 获取商品类型
getGoodsTypeList() {
this.$http({
url: this.$http.adornUrl('/book/sysdictdata/selectByType/goodsType'),
method: 'get',
}).then(({
data
}) => {
url: this.$http.adornUrl("/book/sysdictdata/selectByType/goodsType"),
method: "get"
}).then(({ data }) => {
// console.log(data.dataList)
this.goodsTypeList = data.dataList
})
this.goodsTypeList = data.dataList;
});
},
// 删除图书
deliteBook(index) {
this.dataForm.Books.splice(index, 1)
sessionStorage.setItem('Books',JSON.stringify(this.dataForm.Books))
this.dataForm.Books.splice(index, 1);
sessionStorage.setItem("Books", JSON.stringify(this.dataForm.Books));
},
dealImgChange(file, fileList) {
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
// 表单提交
dataFormSubmit() {
this.getBookIds()
this.getBookIds();
// console.log(this.bookidsd,'this.bookidsd')
// return false
this.$refs['dataForm'].validate((valid) => {
this.dataForm.productImageList = this.getStringImgUrl()
var bookIDS = this.getBookIds()
this.$refs["dataForm"].validate(valid => {
this.dataForm.productImageList = this.getStringImgUrl();
var bookIDS = this.getBookIds();
// console.log(this.dataForm.productImageList)
if (valid) {
if (!this.dataForm.hDprice || this.dataForm.hDprice == 0) {
// console.log('没有值')
this.dataForm.hDprice = 0
this.dataForm.hDprice = 0;
}
this.$http({
url: this.$http.adornUrl(`/book/shopproduct/${!this.dataForm.productId ? 'save' : 'update'}`),
method: 'post',
url: this.$http.adornUrl(
`/book/shopproduct/${
!this.dataForm.productId ? "save" : "update"
}`
),
method: "post",
data: this.$http.adornData({
'productId': this.dataForm.productId || undefined,
'productName': this.dataForm.productName,
'price': this.dataForm.price,
'weight': this.dataForm.weight,
'publishStatus': this.dataForm.publishStatus,
'productPid': this.dataForm.poids[this.dataForm.poids.length - 1],
'productImages': this.dataForm.productImages,
'productImageList': this.dataForm.productImageList,
'createTime': this.dataForm.createTime,
'updateTime': this.dataForm.updateTime,
'delFlag': this.dataForm.delFlag,
'sort': this.dataForm.sort,
'goodsType': this.dataForm.goodsType,
'productDetails': this.dataForm.productDetails,
'author': this.dataForm.author,
'publisher': this.dataForm.publisher,
'pubDate': this.dataForm.pubDate,
'shoproudLabels': this.dataForm.tags,
productId: this.dataForm.productId || undefined,
productName: this.dataForm.productName,
price: this.dataForm.price,
weight: this.dataForm.weight,
publishStatus: this.dataForm.publishStatus,
productPid: this.dataForm.poids[this.dataForm.poids.length - 1],
productImages: this.dataForm.productImages,
productImageList: this.dataForm.productImageList,
createTime: this.dataForm.createTime,
updateTime: this.dataForm.updateTime,
delFlag: this.dataForm.delFlag,
sort: this.dataForm.sort,
goodsType: this.dataForm.goodsType,
productDetails: this.dataForm.productDetails,
author: this.dataForm.author,
publisher: this.dataForm.publisher,
pubDate: this.dataForm.pubDate,
shoproudLabels: this.dataForm.tags,
// 'format': this.dataForm.format, // 开本
'isFreeMail': this.dataForm.isFreeMail,
'isNew' : this.dataForm.isNew,
isFreeMail: this.dataForm.isFreeMail,
isNew: this.dataForm.isNew,
// 'pageNum': this.dataForm.pageNum,
// 'quality': this.dataForm.quality, // 内文用纸
'productStock': this.dataForm.productStock, // 库存
'activityPrice': this.dataForm.hDprice,
'bookids': this.bookidsd, // 关联的图书[12,13,45]
productStock: this.dataForm.productStock, // 库存
activityPrice: this.dataForm.hDprice,
bookids: this.bookidsd // 关联的图书[12,13,45]
// 'bookidsimages': this.dataForm.Books // 关联的图书对象
})
}).then(({
data
}) => {
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.visible = false
this.$refs['dataForm'].resetFields()
this.visible = false;
this.$refs["dataForm"].resetFields();
// this.$refs['dataForm'].reset()
this.$emit('refreshDataList')
this.$emit("refreshDataList");
}
})
});
} else {
this.$message.error(data.msg)
this.$message.error(data.msg);
}
})
});
}
})
});
},
changeTime(e) {
console.log(e)
console.log(e);
},
getBookIds() {
// 图书ids
// console.log(this.dataForm.Books,'Books')
this.bookidsd = this.dataForm.Books.map(item => {
return item.id
})
return item.id;
});
},
getTreeList() {
this.$http({
url: this.$http.adornUrl(`/book/shopcategory/listTree`),
method: 'get',
method: "get",
params: this.$http.adornParams()
}).then(({
data
}) => {
}).then(({ data }) => {
this.categorys = data.data;
})
});
},
handlePictureCardPreview(file) {
this.dataForm.productImages = file.url;
@@ -567,7 +687,7 @@
this.swiperfileList.push({
name: file.name,
url: res.url
})
});
// console.log(this.swiperfileList)
this.$message.success("上传成功");
} else {
@@ -576,11 +696,11 @@
},
// 字符串图片地址
getStringImgUrl() {
let arr = this.swiperfileList.map(item => item.url)
let arr = this.swiperfileList.map(item => item.url);
if (arr.length <= 0) {
return null
return null;
} else {
return arr.toString()
return arr.toString();
}
},
handlePicSuccess(res, file) {
@@ -590,7 +710,7 @@
this.fileList.push({
name: file.name,
url: res.url
})
});
// console.log(this.dataForm.productImages,'productImages')
this.$message.success("上传成功");
} else {
@@ -599,21 +719,20 @@
},
bannerHandleRemove(file, fileList) {
// 轮播图删除操作
this.swiperfileList = fileList
this.swiperfileList = fileList;
},
handleRemove(file, fileList) {
this.dataForm.productImages = '';
this.fileList = []
this.dataForm.productImages = "";
this.fileList = [];
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
handlereset() {
this.fileList = [],
this.visible = false
this.dataForm.tagList = []
this.dataForm.Books = []
this.swiperfileList = []
this.$refs['dataForm'].resetFields()
sessionStorage.setItem('Books', JSON.stringify([]))
(this.fileList = []), (this.visible = false);
this.dataForm.tagList = [];
this.dataForm.Books = [];
this.swiperfileList = [];
this.$refs["dataForm"].resetFields();
sessionStorage.setItem("Books", JSON.stringify([]));
// this.$refs['dataForm'].reset()
},
// 失去焦点事件
@@ -627,46 +746,47 @@
// 准备富文本编辑器
onEditorReady(quill) {
// console.log('editor ready!', quill)
},
}
},
components: {
quillEditor
},
mounted() {
this.$bus.$on("haveBookIds", (data) => {
sessionStorage.setItem('Books', JSON.stringify(data.bookIds))
this.$bus.$on("haveBookIds", data => {
sessionStorage.setItem("Books", JSON.stringify(data.bookIds));
// console.log('haveBookIds',data)
//console.log(data.bookIds, '收到的数据')
var newarr = []
var ids = [] //哨兵数组
var newarr = [];
var ids = []; //哨兵数组
if (data.bookIds && data.bookIds.length > 0) {
ids[0] = data.bookIds[0].id
newarr[0] = data.bookIds[0]
ids[0] = data.bookIds[0].id;
newarr[0] = data.bookIds[0];
// console.log(ids,'ids')
// newarr.push(data.bookIds[0])
for (let index = 0; index < data.bookIds.length; index++) {
if (!ids.includes(data.bookIds[index].id)) {
// console.log(data.bookIds[index].id, 'data.bookIds[index].id')
newarr.push(data.bookIds[index])
ids.push(data.bookIds[index].id)
newarr.push(data.bookIds[index]);
ids.push(data.bookIds[index].id);
}
}
}
// console.log(newarr,'newarr',ids)
data.bookIds.length > 0 ? this.dataForm.Books = newarr : this.dataForm.Books = []
data.bookIds.length > 0
? (this.dataForm.Books = newarr)
: (this.dataForm.Books = []);
});
},
watch: {
visible: {
handler(val, oldVal) {
this.getGoodsTypeList()
this.getGoodsTypeList();
},
deep: true
},
}
}
};
</script>
<style lang="less">

67
src/views/modules/shop/shopproduct.vue
View File

@@ -88,7 +88,7 @@
fixed="right"
header-align="center"
align="center"
width="180"
width="240"
label="操作"
>
<template slot-scope="scope">
@@ -101,21 +101,51 @@
<el-button
type="text"
size="small"
@click="handleEditCurriculum(scope.row.productId)"
>修改课程</el-button
>
<el-button
type="text"
size="small"
@click="handleEditTags(scope.row.productId)"
>修改标签</el-button
@click.native="handleEditCurriculum(scope.row.productId)"
>新版修改</el-button
>
<el-button
style="color:red"
type="text"
size="small"
@click="deleteHandle(scope.row.productId)"
>删除</el-button
>
<el-dropdown>
<el-button
type="text"
size="small"
>更多操作<i class="el-icon-arrow-down el-icon--right"></i></el-button
>
<!-- <span type="primary" size="mini" class="el-dropdown-link">
更多操作<i class="el-icon-arrow-down el-icon--right"></i>
</span> -->
<el-dropdown-menu slot="dropdown">
<!-- <el-dropdown-item
@click.native="addOrUpdateHandle(scope.row.productId)"
>修改</el-dropdown-item
>
<el-dropdown-item
@click.native="handleEditCurriculum(scope.row.productId)"
>新版修改</el-dropdown-item
> -->
<el-dropdown-item
@click.native="handleEditCorrelation(scope.row.productId)"
>关联绑定</el-dropdown-item
>
<el-dropdown-item
@click.native="handleEditTags(scope.row.productId)"
>修改标签</el-dropdown-item
>
<!-- <el-dropdown-item style="color:red"
@click.native="deleteHandle(scope.row.productId)"
>删除</el-dropdown-item
> -->
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
@@ -137,7 +167,6 @@
@showchooseBookf="showchooseBookf"
></add-or-update>
<curriculum
v-if="curriculumVisible"
ref="curriculum"
@@ -145,8 +174,6 @@
@showchooseBookf="showchooseBookf"
></curriculum>
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@@ -155,6 +182,9 @@
></add-or-update>
<commonTags ref="commonTags"></commonTags>
<correlation ref="correlation"></correlation>
<choose-book v-if="chooseBookVisible" :bookIds = bookIds ref="chooseBook" :chooseBookVisible = chooseBookVisible @closeBookf = "closeBookf"></choose-book> -->
</div>
</template>
@@ -163,7 +193,9 @@ import chooseBook from "./chooseBook.vue";
import curriculum from "./curriculum.vue";
import AddOrUpdate from "./shopproduct-add-or-update";
// import AddOrUpdate from "./shopproduct-add-or-update";
import commonTags from "./commonBookTags/commonTags.vue";
import commonTree from "@/views/components/commonBookTags/tags.vue";
import commonTags from "./commonBookTags/commonTags1.vue";
import correlation from "./commonBookTags/correlation.vue";
export default {
data() {
return {
@@ -187,7 +219,8 @@ export default {
curriculum,
AddOrUpdate,
chooseBook,
commonTags
commonTags,
correlation
},
activated() {
this.getDataList();
@@ -198,6 +231,11 @@ export default {
this.$refs.commonTags.open(id);
});
},
handleEditCorrelation(id) {
this.$nextTick(() => {
this.$refs.correlation.open(id);
});
},
closeBookf() {
this.chooseBookVisible = false;
},
@@ -249,6 +287,7 @@ export default {
},
// 新增 / 修改
addOrUpdateHandle(id) {
console.log(11111111111111111);
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id);