活动池功能
parent
72ed974353
commit
06eacf09e7
File diff suppressed because it is too large
Load Diff
@ -1,13 +1,128 @@
|
||||
<template>
|
||||
<div>活动管理</div>
|
||||
<div class="activityManager">
|
||||
<Row>
|
||||
<i-col class="activityListClass" v-for="(item, index) in activityList" :key="index" span="7" offset="1">
|
||||
<Card>
|
||||
<div class="operateAndThemeItem">
|
||||
<div class="ThemeItem">
|
||||
<img class="img" :src="item.img">
|
||||
<div class="tipItem">
|
||||
<span>{{item.name}}</span>
|
||||
<span>{{item.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operateItem">
|
||||
<div @click="disPlayUseTable">使用</div>
|
||||
<div @click="dispalyAddActivity(item.id)">配置</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</i-col>
|
||||
</Row>
|
||||
<Row>
|
||||
<i-col span="7" offset="1">
|
||||
<div @click="dispalyAddActivity('')" class="addactivity">
|
||||
<span>+</span>
|
||||
<span>添加活动</span>
|
||||
</div>
|
||||
</i-col>
|
||||
</Row>
|
||||
<useTable @dispalyuseModal="dispalyuseModal" :useModal="useModal"></useTable>
|
||||
<addActivity @dispalyAddActivityModal="dispalyAddActivityModal" :addActivityModal="addActivityModal" :id="id"></addActivity>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Img from '../../assets/logo.png'
|
||||
import useTable from './useTable'
|
||||
import addActivity from './addActivity'
|
||||
import ActivityManager from "../../services/ActivityManager/ActivityManager";
|
||||
export default {
|
||||
name: "ActivityManager"
|
||||
name: "ActivityManager",
|
||||
components: {
|
||||
useTable,
|
||||
addActivity
|
||||
},
|
||||
inject: ['setMenuName'],
|
||||
data() {
|
||||
return {
|
||||
useModal: false,
|
||||
addActivityModal: false,
|
||||
activityList: [],
|
||||
id: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.setMenuName("活动管理", "活动池")
|
||||
this.getActivityTable()
|
||||
},
|
||||
methods: {
|
||||
getActivityTable() {
|
||||
let that = this
|
||||
ActivityManager.getActivityList({}, function (data) {
|
||||
that.activityList = data.data.results
|
||||
})
|
||||
},
|
||||
disPlayUseTable() {
|
||||
this.useModal = true
|
||||
},
|
||||
dispalyAddActivity(val) {
|
||||
this.addActivityModal = true
|
||||
this.id = val.toString()
|
||||
},
|
||||
dispalyuseModal(displayModalFlag, isCancle) {
|
||||
this.useModal = displayModalFlag
|
||||
if(isCancle === true) {
|
||||
this.getActivityTable()
|
||||
}
|
||||
},
|
||||
dispalyAddActivityModal(displayModalFlag, isCancle) {
|
||||
this.addActivityModal = displayModalFlag
|
||||
if(isCancle === true) {
|
||||
this.getActivityTable()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.operateAndThemeItem {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
.operateItem {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #6ac1d1;
|
||||
width: 20%;
|
||||
text-align: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ThemeItem {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
width: 80%;
|
||||
}
|
||||
.tipItem {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-left: 50px;
|
||||
}
|
||||
.activityListClass {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.addactivity{
|
||||
height: 300px;
|
||||
border: 1px dashed;
|
||||
text-align: center;
|
||||
line-height: 300px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@ -0,0 +1,220 @@
|
||||
<template>
|
||||
<Modal v-model="dispalyModal" width="1000" :mask-closable="false" @on-cancel="cancel">
|
||||
<p slot="header" style="color:#f60;text-align:left">
|
||||
<span>配置活动</span>
|
||||
</p>
|
||||
<div>基本配置</div>
|
||||
<Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
|
||||
<Row>
|
||||
<i-col style="text-align: left;" span="8">
|
||||
<FormItem label="" prop="uploadImg">
|
||||
<!-- <Upload
|
||||
type="select"
|
||||
:on-success="uploadImgSuccess"
|
||||
:show-upload-list="false"
|
||||
:before-upload="handleBeforeUpload"
|
||||
action="//jsonplaceholder.typicode.com/posts/">
|
||||
<div style="padding: 20px 0;">
|
||||
<Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
|
||||
<p>上传活动图片</p>
|
||||
</div>
|
||||
</Upload> -->
|
||||
<Upload
|
||||
ref='upload'
|
||||
:show-upload-list="false"
|
||||
:on-success="uploadImgSuccess"
|
||||
:format="['jpg','jpeg','png']"
|
||||
:max-size="2048"
|
||||
:before-upload="handleBeforeUpload"
|
||||
multiple
|
||||
type="drag"
|
||||
action=""
|
||||
style="display: inline-block;">
|
||||
<div style="width: 200px;height:200px;line-height: 200px;">
|
||||
<span>请上传图片</span>
|
||||
</div>
|
||||
</Upload>
|
||||
</FormItem>
|
||||
</i-col>
|
||||
<i-col span="15" offset="1">
|
||||
<FormItem label="活动名称" prop="activityName">
|
||||
<i-input type="text" v-model="formValidate.activityName" placeholder="请输入活动名称"></i-input>
|
||||
</FormItem>
|
||||
<Form-item label="活动描述" prop="activityDsc">
|
||||
<i-input v-model="formValidate.activityDsc" type="textarea" :autosize="{minRows: 3}" placeholder="请输入活动描述"></i-input>
|
||||
</Form-item>
|
||||
<FormItem label="APPID" prop="appId">
|
||||
<i-input type="text" v-model="formValidate.appId" placeholder="请输入appid"></i-input>
|
||||
</FormItem>
|
||||
<FormItem label="URI" prop="uri">
|
||||
<i-input type="text" v-model="formValidate.uri" placeholder="请输入URI"></i-input>
|
||||
</FormItem>
|
||||
</i-col>
|
||||
</Row>
|
||||
</Form>
|
||||
<div class="topic">活动类型</div>
|
||||
<Row class="inputItem" v-for="(item, index) in inputActivityList" :key="index">
|
||||
<i-col :span="2">
|
||||
类型{{index+1}}
|
||||
</i-col>
|
||||
<i-col :span="20">
|
||||
<i-input class="inputClass" type="text" v-model="item.value1" placeholder=""></i-input>
|
||||
<i-input class="inputClass" type="text" style="margin-left: 20px" v-model="item.value2" placeholder=""></i-input>
|
||||
<Button style="margin-left: 20px" type="error" @click="delActivityInput(index)">删除</Button>
|
||||
</i-col>
|
||||
</Row>
|
||||
<Button style="margin-top: 10px" type="primary" @click="addActivityInput">+添加活动类型</Button>
|
||||
<div style="text-align: center;" slot="footer">
|
||||
<Button type="primary" size="large" shape="circle" :loading="modal_loading" @click="next">保存</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
<script>
|
||||
import ActivityManager from "../../services/ActivityManager/ActivityManager";
|
||||
export default {
|
||||
name: "addActivity",
|
||||
data() {
|
||||
return {
|
||||
dispalyModal: false,
|
||||
currentStep: 0,
|
||||
modal_loading: false,
|
||||
inputActivityList: [],
|
||||
imageName: '212',
|
||||
formValidate: {
|
||||
activityName: '',
|
||||
activityDsc: '',
|
||||
appId: '',
|
||||
uri: ''
|
||||
},
|
||||
ruleValidate: {
|
||||
activityName: [
|
||||
{ required: true, message: '活动名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
activityDsc: [
|
||||
{ required: true, message: '活动描述不能为空', trigger: 'blur' }
|
||||
],
|
||||
appId: [
|
||||
{ required: true, message: 'appId不能为空', trigger: 'blur' }
|
||||
],
|
||||
uri: [
|
||||
{ required: true, message: 'URI不能为空', trigger: 'blur' }
|
||||
],
|
||||
// uploadImg: [
|
||||
// { required: true, message: '请上传活动图片', trigger: 'blur' }
|
||||
// ]
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
addActivityModal: Boolean,
|
||||
id: String
|
||||
},
|
||||
watch: {
|
||||
addActivityModal(val) {
|
||||
this.dispalyModal = val
|
||||
if(val === true && this.id) {
|
||||
this.getActivityData()
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
addActivityInput() {
|
||||
this.inputActivityList.push({
|
||||
value1: '',
|
||||
value2: ''
|
||||
})
|
||||
},
|
||||
delActivityInput(index) {
|
||||
this.inputActivityList.splice(index,1)
|
||||
},
|
||||
cancel() {
|
||||
this.inputActivityList = []
|
||||
this.formValidate.appId = ''
|
||||
this.formValidate.activityDsc = ''
|
||||
this.formValidate.activityName = ''
|
||||
this.formValidate.uri = ''
|
||||
this.dispalyModal = false
|
||||
this.$emit("dispalyAddActivityModal", false, false)
|
||||
},
|
||||
getActivityData() {
|
||||
let that = this
|
||||
let data = {
|
||||
id: that.id
|
||||
}
|
||||
ActivityManager.getActivityInfo(data, function (data) {
|
||||
that.inputActivityList = []
|
||||
that.formValidate.appId = data.data.results.appId
|
||||
that.formValidate.activityDsc = data.data.results.description
|
||||
that.formValidate.activityName = data.data.results.name
|
||||
that.formValidate.uri = data.data.results.uri
|
||||
data.data.results.params.forEach(item => {
|
||||
that.inputActivityList.push({
|
||||
value1: item.name,
|
||||
value2: item.description
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
uploadImgSuccess(res, file) {
|
||||
debugger
|
||||
this.imageName = file.name
|
||||
},
|
||||
handleBeforeUpload(res, file) {
|
||||
let data = new FormData()
|
||||
data.append('file', res.name)
|
||||
ActivityManager.uploadImg(data, function (data) {
|
||||
})
|
||||
},
|
||||
next() {
|
||||
let that = this
|
||||
this.$refs["formValidate"].validate((valid) => {
|
||||
if (valid) {
|
||||
let param = []
|
||||
that.inputActivityList.forEach(element => {
|
||||
param.push({
|
||||
defaultVal: element.value1,
|
||||
description: that.formValidate.activityDsc,
|
||||
key: element.value2,
|
||||
name: 1,
|
||||
type: 2,
|
||||
id: that.id
|
||||
})
|
||||
})
|
||||
// param = JSON.stringify(param)
|
||||
let data = {
|
||||
appId: that.formValidate.appId,
|
||||
image: that.imageName,
|
||||
name: that.formValidate.activityName,
|
||||
uri: that.formValidate.uri,
|
||||
params: param,
|
||||
isGetActivityInfo: true,
|
||||
description: that.formValidate.activityDsc,
|
||||
id: that.id
|
||||
}
|
||||
ActivityManager.addOreditActivity(data, function (data) {
|
||||
console.log(data)
|
||||
that.addActivityModal = false
|
||||
that.$emit("dispalyAddActivityModal", false, true)
|
||||
})
|
||||
} else {
|
||||
that.$Message.error('表单验证失败!');
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.inputClass{
|
||||
width: 1000px;
|
||||
}
|
||||
.inputItem{
|
||||
margin-top: 40px;
|
||||
}
|
||||
.topic{
|
||||
margin-top: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div style="padding: 0 40px;">
|
||||
<Form ref="formValidate" :model="formValidate" :label-width="80">
|
||||
<Row>
|
||||
<i-col span="15" offset="2">
|
||||
<FormItem label="活动名称" prop="activityName">
|
||||
<div>{{formValidate.activityName}}</div>
|
||||
</FormItem>
|
||||
<Form-item label="活动时间" prop="activityDate">
|
||||
<div>{{formValidate.activityDate}}</div>
|
||||
</Form-item>
|
||||
<FormItem label="活动类型" prop="activityStyle">
|
||||
<div>{{formValidate.activityStyle}}</div>
|
||||
</FormItem>
|
||||
<FormItem label="活动范围" prop="activityRange">
|
||||
<div>
|
||||
<span>{{formValidate.activityRange}}</span>
|
||||
<span class="mr10">{{formValidate.activityCompanyNum}}家店铺</span>
|
||||
<Button class="mr10" type="primary" @click="isDisplay">{{operate}}</Button>
|
||||
</div>
|
||||
<div v-if="displayActivityShopFlag==true" class="activityShopClass">
|
||||
<div class="mr10" v-for="(item, index) in formValidate.activityShop" :key="index">
|
||||
<Tag class="tagClass" color="blue">{{item.name}}</Tag>
|
||||
</div>
|
||||
</div>
|
||||
</FormItem>
|
||||
</i-col>
|
||||
</Row>
|
||||
</Form>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "useActivityStepFoure",
|
||||
data() {
|
||||
return {
|
||||
formValidate: {
|
||||
activityName: '红包活动',
|
||||
activityDate: "2020/05/20-2020/0522",
|
||||
activityStyle: '5元红包',
|
||||
activityRange: '上海分公司',
|
||||
activityCompanyNum: '35',
|
||||
activityShop: [{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
},{
|
||||
name: '店铺1'
|
||||
}]
|
||||
},
|
||||
operate: '收起',
|
||||
displayActivityShopFlag: false
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
isDisplay() {
|
||||
if(this.operate === '展开') {
|
||||
this.operate = '收起'
|
||||
this.displayActivityShopFlag = false
|
||||
} else {
|
||||
this.operate = '展开'
|
||||
this.displayActivityShopFlag = true
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.activityShopClass {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.mr10 {
|
||||
margin-left: 40px;
|
||||
}
|
||||
.tagClass {
|
||||
width: 360px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,75 @@
|
||||
<template>
|
||||
<div>
|
||||
<Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
|
||||
<Row>
|
||||
<i-col span="15" offset="2">
|
||||
<FormItem label="活动名称" prop="activityName">
|
||||
<div>{{formValidate.activityName}}</div>
|
||||
</FormItem>
|
||||
<div class="dateClass">
|
||||
<Form-item label="活动时间" prop="activityStartDate">
|
||||
<Date-picker :value="formValidate.activityStartDate" format="yyyy-MM-dd" placeholder="请选择开始日期" style="width: 200px"></Date-picker>
|
||||
</Form-item>
|
||||
<div class="text">至</div>
|
||||
<Form-item label="" prop="activityEndDate">
|
||||
<Date-picker :value="formValidate.activityEndDate" format="yyyy-MM-dd" placeholder="请选择结束日期" style="width: 200px"></Date-picker>
|
||||
</Form-item>
|
||||
</div>
|
||||
<FormItem label="活动类型" prop="activityStyle">
|
||||
<div v-for="(item, index) in formValidate.activityStyle" :key="index">
|
||||
<i-input disabled type="text" v-model="item.tips" placeholder=""></i-input>
|
||||
</div>
|
||||
</FormItem>
|
||||
</i-col>
|
||||
</Row>
|
||||
</Form>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "useActivityStepOne",
|
||||
data() {
|
||||
return {
|
||||
formValidate: {
|
||||
activityName: '红吧',
|
||||
activityStartDate: '',
|
||||
activityEndDate: '',
|
||||
activityStyle: [{
|
||||
tips: '11',
|
||||
},{
|
||||
tips: '11',
|
||||
}],
|
||||
},
|
||||
ruleValidate: {
|
||||
activityName: [
|
||||
{ required: true, message: '活动名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
activityStartDate: [
|
||||
{ required: true, message: '开始时间不能为空', trigger: 'blur' }
|
||||
],
|
||||
activityEndDate: [
|
||||
{ required: true, message: '结束时间不能为空', trigger: 'blur' }
|
||||
],
|
||||
activityStyle: [
|
||||
{ required: true, message: '', trigger: 'blur' }
|
||||
],
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dateClass {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.text {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<div style="padding: 0 40px;">
|
||||
<div class="selectClass">
|
||||
<Radio v-model="allSelect">全选</Radio>
|
||||
<i-input icon="search" placeholder="请输入店铺名称或编码" style="width: 250px"></i-input>
|
||||
</div>
|
||||
<div class="companyTable">
|
||||
<div class="companyListClass">
|
||||
<div :class="isSelect[index] == true ? 'tagColorClass' : ''" class="tagClass" @click="selectTag(item,index)" v-for="(item, index) in companyList" :key="index" >{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "useActivityStepThree",
|
||||
data() {
|
||||
return {
|
||||
allSelect: false,
|
||||
companyList: [{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
}],
|
||||
isSelect:[],
|
||||
selectValue: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.companyList.forEach(element => {
|
||||
this.isSelect.push('')
|
||||
this.selectValue.push('')
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
selectTag(value,index) {
|
||||
this.isSelect.splice(index,1,!this.isSelect[index])
|
||||
if(this.isSelect[index] === true) {
|
||||
this.selectValue.splice(index, 1, value.id)
|
||||
} else if(this.isSelect[index] === false) {
|
||||
this.selectValue.splice(index, 1, '')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.selectClass {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.companyTable {
|
||||
width: 3150px;
|
||||
height: 1000px;
|
||||
border: 1px solid;
|
||||
margin-top: 40px;
|
||||
padding: 40px;
|
||||
overflow:scroll;
|
||||
}
|
||||
.companyListClass {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.tagClass {
|
||||
width: 31%;
|
||||
margin-bottom: 30px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
border: 1px solid #e3e8ee!important;
|
||||
color: #657180!important;
|
||||
background: #fff;
|
||||
padding: 0 12px;
|
||||
}
|
||||
.tagColorClass {
|
||||
background: #6ac1d1;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div style="padding: 0 40px;">
|
||||
<div class="selectClass">
|
||||
<Radio v-model="allSelect">全选</Radio>
|
||||
<i-input icon="search" placeholder="请输入零售公司名称或编码" style="width: 250px"></i-input>
|
||||
</div>
|
||||
<div class="companyTable">
|
||||
<div class="companyListClass">
|
||||
<div :class="companyColorIndex == index ? 'tagColorClass' : ''" class="tagClass" @click="selectTag(index)" v-for="(item, index) in companyList" :key="index" >{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "useActivityStepTwo",
|
||||
data() {
|
||||
return {
|
||||
allSelect: false,
|
||||
companyList: [{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
},{
|
||||
name: '111'
|
||||
}],
|
||||
companyColorIndex: -1
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
selectTag(val) {
|
||||
this.companyColorIndex = val
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.selectClass {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.companyTable {
|
||||
width: 3150px;
|
||||
height: 1000px;
|
||||
border: 1px solid;
|
||||
margin-top: 40px;
|
||||
padding: 40px;
|
||||
overflow:scroll;
|
||||
}
|
||||
.companyListClass {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.tagClass {
|
||||
width: 31%;
|
||||
margin-bottom: 30px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
border: 1px solid #e3e8ee!important;
|
||||
color: #657180!important;
|
||||
background: #fff;
|
||||
padding: 0 12px;
|
||||
}
|
||||
.tagColorClass {
|
||||
background: #6ac1d1;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<Modal v-model="useModal" @on-cancel="cancel" width="1000">
|
||||
<Steps style="padding: 40px;" :current="currentStep">
|
||||
<Step title="基本信息" content=""></Step>
|
||||
<Step title="选择零售公司" content=""></Step>
|
||||
<Step title="选择店铺" content=""></Step>
|
||||
<Step title="确认信息" content=""></Step>
|
||||
</Steps>
|
||||
<useActivityStepOne v-if="currentStep==0"></useActivityStepOne>
|
||||
<useActivityStepTwo v-if="currentStep==1"></useActivityStepTwo>
|
||||
<useActivityStepThree v-if="currentStep==2"></useActivityStepThree>
|
||||
<useActivityStepFoure v-if="currentStep==3"></useActivityStepFoure>
|
||||
<div slot="footer">
|
||||
<Button v-if="currentStep!==0" type="primary" shape="circle" :loading="modal_loading" @click="back">上一步</Button>
|
||||
<Button v-if="currentStep!==3" type="primary" shape="circle" :loading="modal_loading" @click="next">下一步</Button>
|
||||
<Button v-if="currentStep==3" type="primary" shape="circle" :loading="modal_loading" @click="finish">完成</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
<script>
|
||||
import useActivityStepOne from './useActivityStepOne'
|
||||
import useActivityStepTwo from './useActivityStepTwo'
|
||||
import useActivityStepThree from './useActivityStepThree'
|
||||
import useActivityStepFoure from './useActivityStepFoure'
|
||||
export default {
|
||||
name: "useTable",
|
||||
components: {
|
||||
useActivityStepOne,
|
||||
useActivityStepTwo,
|
||||
useActivityStepThree,
|
||||
useActivityStepFoure
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentStep: 0,
|
||||
modal_loading: false,
|
||||
}
|
||||
},
|
||||
props: {
|
||||
useModal: Boolean
|
||||
},
|
||||
watch: {
|
||||
useModal(val) {
|
||||
this.useModal = val
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.useModal)
|
||||
},
|
||||
methods: {
|
||||
cancel() {
|
||||
this.$emit("dispalyuseModal", false, false)
|
||||
},
|
||||
next() {
|
||||
this.currentStep = this.currentStep + 1
|
||||
},
|
||||
back() {
|
||||
this.currentStep = this.currentStep - 1
|
||||
},
|
||||
finish() {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
@ -0,0 +1,45 @@
|
||||
/**
|
||||
* 登录 server层
|
||||
* @author yuankai
|
||||
* @date 2020/05/19
|
||||
*/
|
||||
|
||||
import http from '../CommonHttp'
|
||||
|
||||
/**
|
||||
* 活动池列表
|
||||
* @param params 参数
|
||||
* @param call 成功的回调
|
||||
* @returns {Promise<any>} 返回Promise对象
|
||||
*/
|
||||
export function getActivityList(params, call) {
|
||||
return http.get('/activity/schedule/list/all', params).then(call)
|
||||
}
|
||||
|
||||
/**
|
||||
* 新增或修改活动池
|
||||
*/
|
||||
export function addOreditActivity(params, call) {
|
||||
return http.post('/activity/schedule/save',params).then(call)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取活动池详情
|
||||
*/
|
||||
export function getActivityInfo(params, call) {
|
||||
return http.get('/activity/schedule/detail',params).then(call)
|
||||
}
|
||||
|
||||
/**
|
||||
* 上传图片
|
||||
*/
|
||||
export function uploadImg(params, call) {
|
||||
return http.post('/upload',params).then(call)
|
||||
}
|
||||
|
||||
export default {
|
||||
getActivityList,
|
||||
addOreditActivity,
|
||||
getActivityInfo,
|
||||
uploadImg
|
||||
}
|
||||
Loading…
Reference in New Issue