tianyi 3 weeks ago
parent
commit
5555bd1218
  1. 233
      src/views/app/business/lineManage/addEdit.vue
  2. 60
      src/views/app/business/lineManage/lineManage.vue

233
src/views/app/business/lineManage/addEdit.vue

@ -11,7 +11,8 @@
<Col span="24"> <Col span="24">
<FormItem label="广告位置" prop="position"> <FormItem label="广告位置" prop="position">
<Select v-model="form.position" style="width:200px"> <Select v-model="form.position" style="width:200px">
<Option v-for="item in dictData" :value="item.value" :key="item.value">{{ item.title }}</Option> <Option v-for="item in dictData" :value="item.value" :key="item.value">{{ item.title }}
</Option>
</Select> </Select>
</FormItem> </FormItem>
</Col> </Col>
@ -19,16 +20,26 @@
<Row :gutter="32"> <Row :gutter="32">
<Col span="12"> <Col span="12">
<FormItem label="商家名" prop="value"> <FormItem label="商家名" prop="value">
<Select v-model="form.merchantId" filterable @on-change="checkShop" :remote-method="sreachShop" :loading="loading1"> <Select v-model="form.merchantId" filterable @on-change="checkShop"
<Option v-for="item in shopList" v-model="item.value" :key="item.value">{{ item.label }}</Option> :remote-method="sreachShop" :loading="loading1">
<Option v-for="item in shopList" v-model="item.value" :key="item.value">{{ item.label }}
</Option>
</Select> </Select>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
<Row :gutter="32"> <Row :gutter="32">
<Col span="24"> <Col span="24">
<FormItem label="广告图" prop="adImage"> <FormItem label="广告图" prop="adImage">
<upload-pic-input v-model="form.adImage"></upload-pic-input> <div v-for="(item,index) in adList" :key="index" style="display: flex;line-height: 30px;">
<upload-pic-input v-model="item.pic"></upload-pic-input>
<Icon @click="delOne(index)" type="ios-trash-outline" v-if="adList.length>1" size="30"
color="red" />
</div>
<div v-if="form.position == 'home_top'" style="margin-top:10px;" @click="addOne">
<Icon type="ios-add-circle-outline" size="30" color="#000" />
</div>
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
@ -49,7 +60,8 @@
<Row :gutter="32"> <Row :gutter="32">
<Col span="24"> <Col span="24">
<FormItem label="广告关联商品" prop="productList1"> <FormItem label="广告关联商品" prop="productList1">
<div @click="checkGoods" style="display: flex;height: 35px;width: 100%;border: 1px solid #eee;padding: 0 0 0 10px;border-radius: 5px;line-height: 35px;"> <div @click="checkGoods"
style="display: flex;height: 35px;width: 100%;border: 1px solid #eee;padding: 0 0 0 10px;border-radius: 5px;line-height: 35px;">
<div style="flex: 1;">{{form.productList1.productName}}</div> <div style="flex: 1;">{{form.productList1.productName}}</div>
<Icon type="ios-arrow-forward" size="24" style="line-height: 35px;" /> <Icon type="ios-arrow-forward" size="24" style="line-height: 35px;" />
</div> </div>
@ -58,19 +70,19 @@
</Row> </Row>
<Row :gutter="32" v-if="form.productList1.productName != ''"> <Row :gutter="32" v-if="form.productList1.productName != ''">
<Col span="12"> <Col span="12">
<FormItem label="商品原价" prop="originalPrice"> <FormItem label="商品原价" prop="originalPrice">
<Input v-model="form.productList1.originalPrice" placeholder="请输入商品原价" /> <Input v-model="form.productList1.originalPrice" placeholder="请输入商品原价" />
</FormItem> </FormItem>
</Col> </Col>
<Col span="12"> <Col span="12">
<FormItem label="商品拼团价格" prop="originalPrice"> <FormItem label="商品拼团价格" prop="originalPrice">
<Input v-model="form.productList1.groupPrice" placeholder="请输入商品拼团价格" /> <Input v-model="form.productList1.groupPrice" placeholder="请输入商品拼团价格" />
</FormItem> </FormItem>
</Col> </Col>
<Col span="12"> <Col span="12">
<FormItem label="几人团" prop="originalPrice"> <FormItem label="几人团" prop="originalPrice">
<Input type="number" v-model="form.productList1.groupMembers" placeholder="请输入商品拼团价格" /> <Input type="number" v-model="form.productList1.groupMembers" placeholder="请输入商品拼团价格" />
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
</Form> </Form>
@ -118,9 +130,12 @@
}, },
data() { data() {
return { return {
loading1:false, adList: [{
aaVisiable:false, pic: ''
shopList:[], }],
loading1: false,
aaVisiable: false,
shopList: [],
roleList: [], roleList: [],
visible: this.value, visible: this.value,
title: "", title: "",
@ -146,17 +161,17 @@
maxHeight: 510, maxHeight: 510,
form: { form: {
position: '', position: '',
sortOrder:"", sortOrder: "",
title:'', title: '',
adImage:'', adImage: '',
status:1, status: 1,
regionId:JSON.parse(this.getStore("user")).departmentId, regionId: JSON.parse(this.getStore("user")).departmentId,
merchantName:'', merchantName: '',
merchantId:'', merchantId: '',
merchantImage:'', merchantImage: '',
linkUrl:'/package1/group/groupBuySingle?type=shop&item=', linkUrl: '/package1/group/groupBuySingle?type=shop&item=',
linkParams:'', linkParams: '',
productList1:{ productList1: {
adId: "", adId: "",
productImage: "", productImage: "",
productName: "", productName: "",
@ -164,10 +179,10 @@
groupPrice: "", groupPrice: "",
groupMembers: "" groupMembers: ""
}, },
productList:[] productList: []
}, },
searchForm: { searchForm: {
regionId:JSON.parse(this.getStore("userInfo")).departmentId, regionId: JSON.parse(this.getStore("userInfo")).departmentId,
shopType: "", shopType: "",
shopArea: "", shopArea: "",
pageNumber: 1, pageNumber: 1,
@ -186,11 +201,24 @@
}, },
methods: { methods: {
init() { init() {
},
addOne() {
let data = {
pic: ''
}
this.adList.push(data)
},
delOne(i) {
this.adList.splice(i, 1);
}, },
submit() { submit() {
this.form.productList.push(this.form.productList1) this.form.productList.push(this.form.productList1)
this.form.linkUrl='/package1/group/groupBuySingle?type=shop&item=' this.form.linkUrl = '/package1/group/groupBuySingle?type=shop&item='
this.form.adImage = ''
for (let i = 0; i < this.adList.length; i++) {
this.form.adImage += this.adList[i].pic + ','
}
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
if (this.type == "1") { if (this.type == "1") {
@ -199,22 +227,22 @@
updateAD(this.form).then((res) => { updateAD(this.form).then((res) => {
this.submitLoading = false; this.submitLoading = false;
if (res.success) { if (res.success) {
this.$Message.success("操作成功"); this.$Message.success("操作成功");
this.$emit("on-submit", true); this.$emit("on-submit", true);
this.form = { this.form = {
position: '', position: '',
sortOrder:"", sortOrder: "",
title:'', title: '',
adImage:'', adImage: '',
status:1, status: 1,
regionId:JSON.parse(this.getStore("user")).departmentId, regionId: JSON.parse(this.getStore("user")).departmentId,
merchantName:'', merchantName: '',
merchantId:'', merchantId: '',
merchantImage:'', merchantImage: '',
linkUrl:'/package1/group/groupBuySingle?type=shop&item=', linkUrl: '/package1/group/groupBuySingle?type=shop&item=',
linkParams:'', linkParams: '',
productList1:{ productList1: {
adId: "", adId: "",
productImage: "", productImage: "",
productName: "", productName: "",
@ -222,7 +250,7 @@
groupPrice: "", groupPrice: "",
groupMembers: "" groupMembers: ""
}, },
productList:[] productList: []
} }
this.visible = false; this.visible = false;
} }
@ -233,22 +261,22 @@
addAD(this.form).then((res) => { addAD(this.form).then((res) => {
this.submitLoading = false; this.submitLoading = false;
if (res.success) { if (res.success) {
this.$Message.success("操作成功"); this.$Message.success("操作成功");
this.$emit("on-submit", true); this.$emit("on-submit", true);
this.form = { this.form = {
position: '', position: '',
sortOrder:"", sortOrder: "",
title:'', title: '',
adImage:'', adImage: '',
status:1, status: 1,
regionId:JSON.parse(this.getStore("user")).departmentId, regionId: JSON.parse(this.getStore("user")).departmentId,
merchantName:'', merchantName: '',
merchantId:'', merchantId: '',
merchantImage:'', merchantImage: '',
linkUrl:'/package1/group/groupBuySingle?type=shop&item=', linkUrl: '/package1/group/groupBuySingle?type=shop&item=',
linkParams:'', linkParams: '',
productList1:{ productList1: {
adId: "", adId: "",
productImage: "", productImage: "",
productName: "", productName: "",
@ -256,7 +284,7 @@
groupPrice: "", groupPrice: "",
groupMembers: "" groupMembers: ""
}, },
productList:[] productList: []
} }
this.visible = false; this.visible = false;
} }
@ -265,9 +293,9 @@
} }
}); });
}, },
checkGoods(){ checkGoods() {
let that = this; let that = this;
if(this.form.merchantId == ''){ if (this.form.merchantId == '') {
this.$Message.warning("您还未选择商家"); this.$Message.warning("您还未选择商家");
return return
} }
@ -276,15 +304,15 @@
that.$refs.goodsPage.init(that.form.linkParams); that.$refs.goodsPage.init(that.form.linkParams);
}); });
}, },
getGoods(v){ getGoods(v) {
console.log('11111',v) console.log('11111', v)
this.form.productList1.productImage = v.productPicture this.form.productList1.productImage = v.productPicture
this.form.productList1.productName = v.productName this.form.productList1.productName = v.productName
console.log('22222',this.form) console.log('22222', this.form)
this.aaVisiable = false this.aaVisiable = false
}, },
sreachShop(v){ sreachShop(v) {
this.searchForm.keyWord = v this.searchForm.keyWord = v
// //
this.loading = true; this.loading = true;
@ -292,28 +320,28 @@
this.loading = false; this.loading = false;
if (res.success) { if (res.success) {
this.shopList = res.result.content; this.shopList = res.result.content;
for(let i=0;i<this.shopList.length;i++){ for (let i = 0; i < this.shopList.length; i++) {
this.shopList[i].label = this.shopList[i].shopName this.shopList[i].label = this.shopList[i].shopName
this.shopList[i].value = this.shopList[i].id this.shopList[i].value = this.shopList[i].id
} }
} }
}); });
}, },
checkShop(v){ checkShop(v) {
console.log("数据",v) console.log("数据", v)
for(let i=0;i<this.shopList.length;i++){ for (let i = 0; i < this.shopList.length; i++) {
if(this.shopList[i].id == v){ if (this.shopList[i].id == v) {
let data = { let data = {
products:this.shopList[i].products, products: this.shopList[i].products,
id:this.shopList[i].id, id: this.shopList[i].id,
shopName:this.shopList[i].shopName, shopName: this.shopList[i].shopName,
shopPhone:this.shopList[i].shopPhone, shopPhone: this.shopList[i].shopPhone,
shopAddress:this.shopList[i].shopAddress, shopAddress: this.shopList[i].shopAddress,
shopIcon:this.shopList[i].shopIcon, shopIcon: this.shopList[i].shopIcon,
shopScore:this.shopList[i].shopScore, shopScore: this.shopList[i].shopScore,
shopTypeTitle:this.shopList[i].shopTypeTitle, shopTypeTitle: this.shopList[i].shopTypeTitle,
saleCount:this.shopList[i].saleCount, saleCount: this.shopList[i].saleCount,
remark:this.shopList[i].remark, remark: this.shopList[i].remark,
} }
this.form.linkParams = JSON.stringify(data) this.form.linkParams = JSON.stringify(data)
this.form.merchantName = this.shopList[i].shopName this.form.merchantName = this.shopList[i].shopName
@ -322,15 +350,15 @@
} }
} }
this.form.productList1 = { this.form.productList1 = {
adId: this.form.productList1.adId, adId: this.form.productList1.adId,
productImage: "", productImage: "",
productName: "", productName: "",
originalPrice: "", originalPrice: "",
groupPrice: "", groupPrice: "",
groupMembers: "" groupMembers: ""
} }
}, },
checkStatusLine(v){ checkStatusLine(v) {
this.form.position = v this.form.position = v
console.log(v) console.log(v)
}, },
@ -358,40 +386,55 @@
if (this.type == "0" || this.type == "1") { if (this.type == "0" || this.type == "1") {
// //
let data = this.data; let data = this.data;
console.log('回显数据',data) console.log('回显数据', data)
// //
this.form = data; this.form = data;
//
if (this.form.adImage.indexOf(',') !== -1) {
// {pic: url}
this.adList = this.form.adImage
.split(',')
.filter(item => item.trim() !== '') //
.map(url => ({
pic: url.trim()
}));
} else {
//
this.adList = [{
pic: this.form.adImage.trim()
}];
}
getShopData(this.searchForm).then((res) => { getShopData(this.searchForm).then((res) => {
this.loading = false; this.loading = false;
if (res.success) { if (res.success) {
this.shopList = res.result.content; this.shopList = res.result.content;
for(let i=0;i<this.shopList.length;i++){ for (let i = 0; i < this.shopList.length; i++) {
this.shopList[i].label = this.shopList[i].shopName this.shopList[i].label = this.shopList[i].shopName
this.shopList[i].value = this.shopList[i].id this.shopList[i].value = this.shopList[i].id
} }
} }
}); });
if(data.productList.length>0){ if (data.productList.length > 0) {
this.form.productList1 = { this.form.productList1 = {
adId: data.id, adId: data.id,
productImage: data.productList[0].productImage, productImage: data.productList[0].productImage,
productName: data.productList[0].productName, productName: data.productList[0].productName,
originalPrice: data.productList[0].originalPrice, originalPrice: data.productList[0].originalPrice,
groupPrice: data.productList[0].groupPrice, groupPrice: data.productList[0].groupPrice,
groupMembers:data.productList[0].groupMembers groupMembers: data.productList[0].groupMembers
} }
}else{ } else {
this.form.productList1 = { this.form.productList1 = {
adId: "", adId: "",
productImage: "", productImage: "",
productName: "", productName: "",
originalPrice: "", originalPrice: "",
groupPrice: "", groupPrice: "",
groupMembers:"" groupMembers: ""
} }
} }
} }
this.$forceUpdate() this.$forceUpdate()
this.visible = value; this.visible = value;

60
src/views/app/business/lineManage/lineManage.vue

@ -155,23 +155,49 @@
width: 100, width: 100,
render: (h, params) => { render: (h, params) => {
return h("img", { //
attrs: { const imageStr = params.row.adImage || '';
src: params.row.adImage, const imageUrls = imageStr.indexOf(',') !== -1
}, ? imageStr.split(',').filter(item => item.trim() !== '').map(url => url.trim())
style: { : [imageStr.trim()];
cursor: "zoom-in",
width: "80px", //
height: "60px", if (imageUrls.length === 0 || (imageUrls.length === 1 && imageUrls[0] === '')) {
margin: "10px 0", return h('span', '无图片');
"object-fit": "contain", }
},
on: { // img
click: () => { const imgElements = imageUrls.map(url => {
this.showPic(params.row.adImage); return h('img', {
}, attrs: {
}, src: url,
}); },
style: {
cursor: "zoom-in",
width: "80px",
height: "60px",
margin: "10px 5px", //
"object-fit": "contain",
"border-radius": "4px",
"background": "#f5f5f5"
},
on: {
click: () => {
this.showPic(url); // URL
},
},
});
});
// div flex
return h('div', {
style: {
display: "flex",
"flex-wrap": "wrap",
"align-items": "center",
"gap": "8px"
}
}, imgElements);
}, },
}, },
{ {

Loading…
Cancel
Save