You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
330 lines
8.9 KiB
330 lines
8.9 KiB
<template>
|
|
<div class="company-edit">
|
|
<!-- Drawer抽屉 -->
|
|
<Drawer :title="title" v-model="visible" width="500" draggable :mask-closable="type == '0'">
|
|
<div :style="{ maxHeight: maxHeight }" class="drawer-content">
|
|
<div class="drawer-header">
|
|
<div style="margin-right: 16px">广告位配置</div>
|
|
</div>
|
|
<Form ref="form" :model="form" :rules="formValidate" label-position="top">
|
|
<Row :gutter="32">
|
|
<Col span="24">
|
|
<FormItem label="广告位置" prop="position">
|
|
<Select ref="dep" @on-change="checkStatusLine" style="width:200px">
|
|
<Option v-for="(item, i) in dictDataLine" :key="i" :value="form.value">{{
|
|
item.title
|
|
}}</Option>
|
|
</Select>
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32">
|
|
<Col span="12">
|
|
<FormItem label="商家名" prop="value">
|
|
<Select v-model="model" filterable @on-change="checkShop" @on-query-change="sreachShop">
|
|
<Option v-for="item in shopList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
|
</Select>
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32">
|
|
<Col span="24">
|
|
<FormItem label="广告图" prop="adImage">
|
|
<upload-pic-input v-model="form.adImage"></upload-pic-input>
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32">
|
|
<Col span="24">
|
|
<FormItem label="广告标题" prop="title">
|
|
<Input v-model="form.title" placeholder="请输入广告标题" />
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32">
|
|
<Col span="24">
|
|
<FormItem label="排序值" prop="sortOrder">
|
|
<Input v-model="form.sortOrder" placeholder="请输入排序值" />
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32">
|
|
<Col span="24">
|
|
<FormItem label="广告关联商品" prop="productList">
|
|
<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.productList.productName}}</div>
|
|
<Icon type="ios-arrow-forward" size="24" style="line-height: 35px;" />
|
|
</div>
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row :gutter="32" v-if="form.productList.productName != ''">
|
|
<Col span="12">
|
|
<FormItem label="商品原价" prop="originalPrice">
|
|
<Input v-model="form.productList.originalPrice" placeholder="请输入商品原价" />
|
|
</FormItem>
|
|
</Col>
|
|
<Col span="12">
|
|
<FormItem label="商品拼团价格" prop="originalPrice">
|
|
<Input v-model="form.productList.groupPrice" placeholder="请输入商品拼团价格" />
|
|
</FormItem>
|
|
</Col>
|
|
<Col span="12">
|
|
<FormItem label="几人团" prop="originalPrice">
|
|
<Input type="number" v-model="form.productList.groupMembers" placeholder="请输入商品拼团价格" />
|
|
</FormItem>
|
|
</Col>
|
|
</Row>
|
|
</Form>
|
|
</div>
|
|
<div class="drawer-footer br" v-show="type != '0'">
|
|
<Button type="primary" :loading="submitLoading" @click="submit">提交</Button>
|
|
<Button @click="visible = false">取消</Button>
|
|
</div>
|
|
</Drawer>
|
|
<Modal :title="商品列表" v-model="aaVisiable" :mask-closable="false" :scrollabele="true" :width="1000">
|
|
<goodsList ref="goodsPage" @on-submit1="getGoods" v-if="aaVisiable"></goodsList>
|
|
<div slot="footer" v-show=aaVisiable>
|
|
<Button type="text" @click="aaVisiable = false">关闭</Button>
|
|
</div>
|
|
</Modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
addAD,
|
|
updateAD,
|
|
getShopData
|
|
} from "@/api/app";
|
|
import goodsList from "./dictManage.vue";
|
|
import uploadPicInput from "@/views/my-components/hiver/upload-pic-input";
|
|
export default {
|
|
name: "company",
|
|
components: {
|
|
uploadPicInput,
|
|
goodsList
|
|
},
|
|
props: {
|
|
value: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
data: {
|
|
type: Object,
|
|
},
|
|
type: {
|
|
type: String,
|
|
default: "0",
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
aaVisiable:false,
|
|
shopList:[],
|
|
dictDataLine: [{
|
|
title: "首页顶部大广告位",
|
|
value: 'home_top'
|
|
}, {
|
|
title: "首页中位左上",
|
|
value: 'home_center_left_top'
|
|
}, {
|
|
title: "首页中位左下",
|
|
value: 'home_center_left_bottom'
|
|
}, {
|
|
title: "首页中位右上",
|
|
value: 'home_center_right_top'
|
|
}, {
|
|
title: "首页中位右下",
|
|
value: 'home_center_right_bottom'
|
|
}],
|
|
roleList: [],
|
|
visible: this.value,
|
|
title: "",
|
|
data: [],
|
|
passColor: "",
|
|
submitLoading: false,
|
|
maxHeight: 510,
|
|
form1:{},
|
|
form: {
|
|
position: '',
|
|
sortOrder:"",
|
|
title:'',
|
|
adImage:'',
|
|
status:1,
|
|
regionId:JSON.parse(this.getStore("user")).departmentId,
|
|
merchantName:'',
|
|
merchantId:'',
|
|
merchantImage:'',
|
|
linkUrl:'/package1/group/groupBuySingle?type=shop&item=',
|
|
linkParams:'',
|
|
productList:{
|
|
adId: "",
|
|
productImage: "",
|
|
productName: "",
|
|
originalPrice: "",
|
|
groupPrice: "",
|
|
groupMembers: ""
|
|
}
|
|
},
|
|
searchForm: {
|
|
regionId:JSON.parse(this.getStore("userInfo")).departmentId,
|
|
shopType: "",
|
|
shopArea: "",
|
|
pageNumber: 1,
|
|
keyWord: "",
|
|
pageSize: 100,
|
|
sort: "",
|
|
order: "",
|
|
sortOrder: "",
|
|
orderOrder: "",
|
|
sortScore: "",
|
|
orderScore: "",
|
|
sortSale: "",
|
|
orderSale: "",
|
|
},
|
|
};
|
|
},
|
|
methods: {
|
|
init() {
|
|
console.log(this.form1)
|
|
this.form.productList = {}
|
|
this.form.productList.adId = this.form1.id
|
|
},
|
|
submit() {
|
|
this.$refs.form.validate((valid) => {
|
|
if (valid) {
|
|
if (this.type == "1") {
|
|
// 编辑
|
|
this.submitLoading = true;
|
|
updateAD(this.form).then((res) => {
|
|
this.submitLoading = false;
|
|
if (res.success) {
|
|
this.$Message.success("操作成功");
|
|
this.$emit("on-submit", true);
|
|
this.visible = false;
|
|
}
|
|
});
|
|
} else {
|
|
// 添加
|
|
this.submitLoading = true;
|
|
addAD(this.form).then((res) => {
|
|
this.submitLoading = false;
|
|
if (res.success) {
|
|
this.$Message.success("操作成功");
|
|
this.$emit("on-submit", true);
|
|
this.visible = false;
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
checkGoods(){
|
|
if(this.form.merchantId == ''){
|
|
this.$Message.warning("您还未选择商家");
|
|
return
|
|
}
|
|
this.aaVisiable = true;
|
|
this.$nextTick(() => {
|
|
this.$refs.goodsPage.init(this.form.linkParams);
|
|
});
|
|
},
|
|
getGoods(v){
|
|
console.log('11111',v)
|
|
this.form.productList.productImage = v.productPicture
|
|
this.form.productList.productName = v.productName
|
|
console.log('22222',this.form)
|
|
this.aaVisiable = false
|
|
},
|
|
sreachShop(v){
|
|
|
|
this.searchForm.keyWord = v
|
|
// 多条件搜索用户列表
|
|
this.loading = true;
|
|
getShopData(this.searchForm).then((res) => {
|
|
this.loading = false;
|
|
if (res.success) {
|
|
this.shopList = res.result.content;
|
|
for(let i=0;i<this.shopList.length;i++){
|
|
this.shopList[i].label = this.shopList[i].shopName
|
|
this.shopList[i].value = this.shopList[i].id
|
|
}
|
|
}
|
|
});
|
|
},
|
|
checkShop(v){
|
|
console.log("数据",v)
|
|
for(let i=0;i<this.shopList.length;i++){
|
|
if(this.shopList[i].id == v){
|
|
let data = {
|
|
products:this.shopList[i].products,
|
|
id:this.shopList[i].id,
|
|
shopName:this.shopList[i].shopName,
|
|
shopPhone:this.shopList[i].shopPhone,
|
|
shopAddress:this.shopList[i].shopAddress,
|
|
shopIcon:this.shopList[i].shopIcon,
|
|
shopScore:this.shopList[i].shopScore,
|
|
shopTypeTitle:this.shopList[i].shopTypeTitle,
|
|
saleCount:this.shopList[i].saleCount,
|
|
remark:this.shopList[i].remark,
|
|
}
|
|
this.form.linkParams = JSON.stringify(data)
|
|
this.form.merchantName = this.shopList[i].shopName
|
|
this.form.merchantId = v
|
|
this.form.merchantImage = this.shopList[i].shopIcon
|
|
}
|
|
}
|
|
},
|
|
checkStatusLine(v){
|
|
this.form.position = v
|
|
console.log(v)
|
|
},
|
|
handleSelectRegion(v) {
|
|
this.form.region = v;
|
|
},
|
|
setCurrentValue(value) {
|
|
if (value === this.visible) {
|
|
return;
|
|
}
|
|
if (this.type == "1") {
|
|
this.title = "编辑广告位";
|
|
this.maxHeight =
|
|
Number(document.documentElement.clientHeight - 121) + "px";
|
|
} else if (this.type == "2") {
|
|
this.title = "添加广告位";
|
|
this.maxHeight =
|
|
Number(document.documentElement.clientHeight - 121) + "px";
|
|
} else {
|
|
this.title = "广告位详情";
|
|
this.maxHeight = "100%";
|
|
}
|
|
// 清空数据
|
|
this.$refs.form.resetFields();
|
|
if (this.type == "0" || this.type == "1") {
|
|
// 回显数据
|
|
let data = this.data;
|
|
|
|
// 回显
|
|
this.form = data;
|
|
}
|
|
this.visible = value;
|
|
},
|
|
},
|
|
watch: {
|
|
value(val) {
|
|
this.setCurrentValue(val);
|
|
},
|
|
visible(value) {
|
|
this.$emit("input", value);
|
|
},
|
|
},
|
|
mounted() {
|
|
this.init();
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less">
|
|
@import "@/styles/drawer-common.less";
|
|
</style>
|