feat(shoppingUpgrade): 加购升级功能开发
This commit is contained in:
woody
parent
7c826a0fce
commit
938e262743
|
|
@ -0,0 +1,38 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 加购升级-活动列表
|
||||||
|
export function upgradeList(params) {
|
||||||
|
return request({
|
||||||
|
url: '/activity/manage/activity/list',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加购升级获取详情
|
||||||
|
export function getShoppingUpgradeDetail(params) {
|
||||||
|
return request({
|
||||||
|
url: '/activity/manage/addUpgradeConfig/get-detail',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加购升级-活动创建/修改/删除
|
||||||
|
export function updateShoppingUpgradeList(data) {
|
||||||
|
return request({
|
||||||
|
url: '/activity/manage/addUpgradeConfig/submit',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加购升级记录列表
|
||||||
|
export function upgradeRecordList(params) {
|
||||||
|
return request({
|
||||||
|
url: '/activity/manage/addUpgradeRecord/list',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -1,9 +1,3 @@
|
||||||
/*
|
|
||||||
* @Descripttion:
|
|
||||||
* @version:
|
|
||||||
* @Author: kBank
|
|
||||||
* @Date: 2023-04-21 14:28:38
|
|
||||||
*/
|
|
||||||
import request from '@/utils/request'
|
import request from '@/utils/request'
|
||||||
|
|
||||||
// 会员消费赠送-查看
|
// 会员消费赠送-查看
|
||||||
|
|
|
||||||
|
|
@ -2059,6 +2059,33 @@ export const constantRoutes = [
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'shoppingUpgrade',
|
||||||
|
name: 'ShoppingUpgrade',
|
||||||
|
component: ParentView,
|
||||||
|
meta: { title: '加购升级' },
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'shoppingUpgradeList',
|
||||||
|
name: 'ShoppingUpgradeList',
|
||||||
|
component: () => import('@/views/marketing/shoppingUpgrade/index'),
|
||||||
|
meta: { title: '加购升级' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'updateInfo',
|
||||||
|
name: 'updateInfo',
|
||||||
|
component: () => import('@/views/marketing/shoppingUpgrade/updateInfo'),
|
||||||
|
meta: { title: '基本信息' },
|
||||||
|
hidden: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'shoppingUpgradeRecordList',
|
||||||
|
name: 'ShoppingUpgradeRecordList',
|
||||||
|
component: () => import('@/views/marketing/shoppingUpgrade/record'),
|
||||||
|
meta: { title: '加购升级记录' }
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
// {
|
// {
|
||||||
// path: 'benefitsGift',
|
// path: 'benefitsGift',
|
||||||
// name: 'BenefitsGift',
|
// name: 'BenefitsGift',
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,409 @@
|
||||||
|
<template>
|
||||||
|
<div class="page">
|
||||||
|
<topBar
|
||||||
|
v-if="topList.length > 0"
|
||||||
|
:top-list="topList"
|
||||||
|
:moren="moren"
|
||||||
|
/>
|
||||||
|
<div class="main">
|
||||||
|
<div class="form_all">
|
||||||
|
<el-form
|
||||||
|
ref="select"
|
||||||
|
:model="select"
|
||||||
|
label-width="auto"
|
||||||
|
>
|
||||||
|
<el-row :gutter="40">
|
||||||
|
<!-- 一层 -->
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :label="'活动名称'">
|
||||||
|
<el-input
|
||||||
|
v-model="select.actName"
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :label="'活动状态'">
|
||||||
|
<el-select
|
||||||
|
v-model="select.activityStatus"
|
||||||
|
clearable
|
||||||
|
:placeholder="'请选择'"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in actStatus"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'开始日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'结束日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime1"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime1"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<!-- <el-col :span="8">
|
||||||
|
<el-form-item :label="'创建日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime2"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime2"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col> -->
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
@click="getDataList"
|
||||||
|
> {{ '搜索' }}</el-button>
|
||||||
|
<el-button
|
||||||
|
size="small"
|
||||||
|
class="resetBtn"
|
||||||
|
@click="reset"
|
||||||
|
> {{ '重置' }}</el-button>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<div class="main_a">
|
||||||
|
<div class="mainbtn">
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeAdd']"
|
||||||
|
size="small"
|
||||||
|
class="addBtn"
|
||||||
|
@click="addHandle"
|
||||||
|
>{{ '添加' }}</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeExport']"
|
||||||
|
size="small"
|
||||||
|
class="exportBtn"
|
||||||
|
@click="handleExport"
|
||||||
|
> {{ '导出' }}</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="maintable">
|
||||||
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
|
:data="tableData"
|
||||||
|
style="width: 100%"
|
||||||
|
height="710px"
|
||||||
|
:header-cell-style="{ background: '#EEEEEE' }"
|
||||||
|
:row-class-name="tableRowClassName"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
<el-table-column
|
||||||
|
type="selection"
|
||||||
|
width="55"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actName"
|
||||||
|
:label="'活动名称'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actStartDate"
|
||||||
|
:label="'开始日期'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actEndDate"
|
||||||
|
:label="'结束日期'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="status"
|
||||||
|
:label="'活动状态'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="creationTime"
|
||||||
|
:label="'创建日期'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="time"
|
||||||
|
:label="'操作'"
|
||||||
|
fixed="right"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeDetail']"
|
||||||
|
type="text"
|
||||||
|
style="color: #48B2FD;"
|
||||||
|
size="small"
|
||||||
|
@click="redirectDetail(scope.row.pkId, 4)"
|
||||||
|
>
|
||||||
|
{{ '查看' }}
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeUpdate']"
|
||||||
|
type="text"
|
||||||
|
style="color: #F3A900;"
|
||||||
|
size="small"
|
||||||
|
@click="redirectDetail(scope.row.pkId, 2)"
|
||||||
|
>
|
||||||
|
{{ '修改' }}
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeDelete']"
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
style="color: #C8161D"
|
||||||
|
@click="handleDelete(scope.row.pkId)"
|
||||||
|
>
|
||||||
|
{{ '删除' }}
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<pagination
|
||||||
|
v-show="total > 0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getDataList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import topBar from '@/components/topBar'
|
||||||
|
import * as api from '@/api/activity.js'
|
||||||
|
import { activityStatus } from '@/api/giftGoods.js'
|
||||||
|
export default {
|
||||||
|
name: 'Bzpz',
|
||||||
|
components: {
|
||||||
|
topBar
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
isAgree(val) {
|
||||||
|
if (!val) {
|
||||||
|
return '允许'
|
||||||
|
} else {
|
||||||
|
return '禁止'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
creationTime: [],
|
||||||
|
creationTime1: [],
|
||||||
|
creationTime2: [],
|
||||||
|
select: {},
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 50
|
||||||
|
},
|
||||||
|
addOrEdit: '',
|
||||||
|
total: 0,
|
||||||
|
dialogVisible: false,
|
||||||
|
tableData: [],
|
||||||
|
loading: false,
|
||||||
|
moren: 'shoppingUpgradeList',
|
||||||
|
topList: [
|
||||||
|
{
|
||||||
|
name: '加购升级',
|
||||||
|
path: 'shoppingUpgradeList'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
form: {
|
||||||
|
name: ''
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
name: [{ required: true, message: '请输入规格类型', trigger: 'blur' }]
|
||||||
|
},
|
||||||
|
actStatus: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// 获取下拉
|
||||||
|
this.getData()
|
||||||
|
// 获取列表
|
||||||
|
this.getDataList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 重置
|
||||||
|
reset() {
|
||||||
|
this.select = {}
|
||||||
|
this.creationTime = []
|
||||||
|
this.creationTime1 = []
|
||||||
|
this.creationTime2 = []
|
||||||
|
this.getDataList()
|
||||||
|
},
|
||||||
|
getData() {
|
||||||
|
activityStatus().then((res) => {
|
||||||
|
this.actStatus = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
changeTime(val) {
|
||||||
|
this.select.startActStartDate = val ? val[0] : ''
|
||||||
|
this.select.endActStartDate = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
changeTime1(val) {
|
||||||
|
this.select.startActEndDate = val ? val[0] : ''
|
||||||
|
this.select.endActEndDate = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
changeTime2(val) {
|
||||||
|
this.select.startCreationTime = val ? val[0] : ''
|
||||||
|
this.select.endCreationTime = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
// 点击修改
|
||||||
|
redirectDetail(id, index) {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'updateInfo',
|
||||||
|
query: {
|
||||||
|
pkId: id,
|
||||||
|
controlType: index
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 删除
|
||||||
|
handleDelete(id) {
|
||||||
|
this.$confirm('确认删除?', '提示', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then(() => {
|
||||||
|
api.updateShoppingUpgradeList({
|
||||||
|
activityParam: {
|
||||||
|
pkId: id
|
||||||
|
},
|
||||||
|
controlType: 3
|
||||||
|
}).then((res) => {
|
||||||
|
this.getDataList()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleClose() {
|
||||||
|
this.dialogVisible = false
|
||||||
|
this.$refs['form'].clearValidate()
|
||||||
|
this.$refs['form'].resetFields()
|
||||||
|
},
|
||||||
|
addHandle() {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'updateInfo',
|
||||||
|
query: {
|
||||||
|
controlType: 1
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取列表
|
||||||
|
getDataList() {
|
||||||
|
this.loading = true
|
||||||
|
api
|
||||||
|
.upgradeList(
|
||||||
|
Object.assign({}, this.queryParams, this.select, { actType: 31 })
|
||||||
|
)
|
||||||
|
.then((res) => {
|
||||||
|
this.tableData = res.rows
|
||||||
|
this.total = res.total
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleSelectionChange(val) {},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.$confirm('是否确认导出所有数据项?', '警告', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then((_) => {
|
||||||
|
this.download(
|
||||||
|
'activity/manage/addUpgradeConfig/export',
|
||||||
|
Object.assign({}, { actType: 31 }, this.queryParams, this.select),
|
||||||
|
`${'加购升级'}${new Date().getTime()}.xlsx`
|
||||||
|
)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
tableRowClassName({ row, rowIndex }) {
|
||||||
|
if (rowIndex % 2 == 1) {
|
||||||
|
return 'warning-row'
|
||||||
|
} else if (rowIndex % 2 == 0) {
|
||||||
|
return 'success-row'
|
||||||
|
}
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
::v-deep .el-table .warning-row {
|
||||||
|
background: #f9f9f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-table .success-row {
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
::v-deep .el-table thead {
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
::v-deep .el-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.page {
|
||||||
|
padding: 20px;
|
||||||
|
background: #f9f9f9;
|
||||||
|
font-size: 14px;
|
||||||
|
.main {
|
||||||
|
// background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.main_a {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
|
||||||
|
}
|
||||||
|
.mainbtn {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.maintable {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-date-editor.el-input,
|
||||||
|
.el-date-editor.el-input__inner {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.form_all {
|
||||||
|
padding: 0 20px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,358 @@
|
||||||
|
<template>
|
||||||
|
<div class="page">
|
||||||
|
<topBar
|
||||||
|
v-if="topList.length > 0"
|
||||||
|
:top-list="topList"
|
||||||
|
:moren="moren"
|
||||||
|
/>
|
||||||
|
<div class="main">
|
||||||
|
<div class="form_all">
|
||||||
|
<el-form
|
||||||
|
ref="select"
|
||||||
|
:model="select"
|
||||||
|
label-width="auto"
|
||||||
|
>
|
||||||
|
<el-row :gutter="40">
|
||||||
|
<!-- 一层 -->
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :label="'活动名称'">
|
||||||
|
<el-input
|
||||||
|
v-model="select.actName"
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-form-item :label="'活动状态'">
|
||||||
|
<el-select
|
||||||
|
v-model="select.activityStatus"
|
||||||
|
clearable
|
||||||
|
:placeholder="'请选择'"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in actStatus"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'开始日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'结束日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime1"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime1"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<!-- <el-col :span="8">
|
||||||
|
<el-form-item :label="'创建日期'">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="creationTime2"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="datetimerange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime2"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col> -->
|
||||||
|
<el-col :span="4">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
@click="getDataList"
|
||||||
|
> {{ '搜索' }}</el-button>
|
||||||
|
<el-button
|
||||||
|
size="small"
|
||||||
|
class="resetBtn"
|
||||||
|
@click="reset"
|
||||||
|
> {{ '重置' }}</el-button>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<div class="main_a">
|
||||||
|
<div class="mainbtn">
|
||||||
|
|
||||||
|
<el-button
|
||||||
|
v-hasButtons="['shoppingUpgradeRecordExport']"
|
||||||
|
size="small"
|
||||||
|
class="exportBtn"
|
||||||
|
@click="handleExport"
|
||||||
|
> {{ '导出' }}</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="maintable">
|
||||||
|
<el-table
|
||||||
|
v-loading="loading"
|
||||||
|
:data="tableData"
|
||||||
|
style="width: 100%"
|
||||||
|
height="710px"
|
||||||
|
:header-cell-style="{ background: '#EEEEEE' }"
|
||||||
|
:row-class-name="tableRowClassName"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
<el-table-column
|
||||||
|
type="selection"
|
||||||
|
width="55"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="memberCode"
|
||||||
|
label="会员编号"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="memberName"
|
||||||
|
label="会员姓名"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actName"
|
||||||
|
:label="'活动名称'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="originalLevelVal"
|
||||||
|
label="原等级"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="upgradeLevelVal"
|
||||||
|
label="新等级"
|
||||||
|
/>
|
||||||
|
<!-- <el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actStartDate"
|
||||||
|
:label="'开始日期'"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="actEndDate"
|
||||||
|
:label="'结束日期'"
|
||||||
|
/> -->
|
||||||
|
<!-- <el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="status"
|
||||||
|
:label="'活动状态'"
|
||||||
|
/> -->
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
prop="creationTime"
|
||||||
|
:label="'创建日期'"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<pagination
|
||||||
|
v-show="total > 0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getDataList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import topBar from '@/components/topBar'
|
||||||
|
import * as api from '@/api/activity.js'
|
||||||
|
import { activityStatus } from '@/api/giftGoods.js'
|
||||||
|
export default {
|
||||||
|
name: 'Bzpz',
|
||||||
|
components: {
|
||||||
|
topBar
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
isAgree(val) {
|
||||||
|
if (!val) {
|
||||||
|
return '允许'
|
||||||
|
} else {
|
||||||
|
return '禁止'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
creationTime: [],
|
||||||
|
creationTime1: [],
|
||||||
|
creationTime2: [],
|
||||||
|
select: {},
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 50
|
||||||
|
},
|
||||||
|
addOrEdit: '',
|
||||||
|
total: 0,
|
||||||
|
dialogVisible: false,
|
||||||
|
tableData: [],
|
||||||
|
loading: false,
|
||||||
|
moren: 'shoppingUpgradeRecordList',
|
||||||
|
topList: [
|
||||||
|
{
|
||||||
|
name: '加购升级记录',
|
||||||
|
path: 'shoppingUpgradeRecordList'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
form: {
|
||||||
|
name: ''
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
name: [{ required: true, message: '请输入规格类型', trigger: 'blur' }]
|
||||||
|
},
|
||||||
|
actStatus: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// 获取下拉
|
||||||
|
this.getData()
|
||||||
|
// 获取列表
|
||||||
|
this.getDataList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 重置
|
||||||
|
reset() {
|
||||||
|
this.select = {}
|
||||||
|
this.creationTime = []
|
||||||
|
this.creationTime1 = []
|
||||||
|
this.creationTime2 = []
|
||||||
|
this.getDataList()
|
||||||
|
},
|
||||||
|
getData() {
|
||||||
|
activityStatus().then((res) => {
|
||||||
|
this.actStatus = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
changeTime(val) {
|
||||||
|
this.select.startActStartDate = val ? val[0] : ''
|
||||||
|
this.select.endActStartDate = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
changeTime1(val) {
|
||||||
|
this.select.startActEndDate = val ? val[0] : ''
|
||||||
|
this.select.endActEndDate = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
changeTime2(val) {
|
||||||
|
this.select.startCreationTime = val ? val[0] : ''
|
||||||
|
this.select.endCreationTime = val ? val[1] : ''
|
||||||
|
},
|
||||||
|
// 点击修改
|
||||||
|
redirectDetail(id, index) {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'updateInfo',
|
||||||
|
query: {
|
||||||
|
pkId: id,
|
||||||
|
controlType: index
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取列表
|
||||||
|
getDataList() {
|
||||||
|
this.loading = true
|
||||||
|
api
|
||||||
|
.upgradeRecordList(
|
||||||
|
Object.assign({}, this.queryParams, this.select, { actType: 31 })
|
||||||
|
)
|
||||||
|
.then((res) => {
|
||||||
|
this.tableData = res.rows
|
||||||
|
this.total = res.total
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleSelectionChange(val) {},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.$confirm('是否确认导出所有数据项?', '警告', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}).then((_) => {
|
||||||
|
this.download(
|
||||||
|
'activity/manage/addUpgradeRecord/listExport',
|
||||||
|
Object.assign({}, { actType: 31 }, this.queryParams, this.select),
|
||||||
|
`${'加购升级记录'}${new Date().getTime()}.xlsx`
|
||||||
|
)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
tableRowClassName({ row, rowIndex }) {
|
||||||
|
if (rowIndex % 2 == 1) {
|
||||||
|
return 'warning-row'
|
||||||
|
} else if (rowIndex % 2 == 0) {
|
||||||
|
return 'success-row'
|
||||||
|
}
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
::v-deep .el-table .warning-row {
|
||||||
|
background: #f9f9f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-table .success-row {
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
::v-deep .el-table thead {
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
::v-deep .el-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.page {
|
||||||
|
padding: 20px;
|
||||||
|
background: #f9f9f9;
|
||||||
|
font-size: 14px;
|
||||||
|
.main {
|
||||||
|
// background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.main_a {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
|
||||||
|
}
|
||||||
|
.mainbtn {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.maintable {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-date-editor.el-input,
|
||||||
|
.el-date-editor.el-input__inner {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.form_all {
|
||||||
|
padding: 0 20px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,405 @@
|
||||||
|
<template>
|
||||||
|
<div class="">
|
||||||
|
<div class="tit">加购升级</div>
|
||||||
|
<div class="xian" />
|
||||||
|
<div class="tabList">
|
||||||
|
<div
|
||||||
|
v-for="item in areaList"
|
||||||
|
:key="item.value"
|
||||||
|
:class="['tabList_i', isArea == item.value ? 'tabAct' : '']"
|
||||||
|
@click="setArea(item.value)"
|
||||||
|
>
|
||||||
|
{{ item.label }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="table">
|
||||||
|
<!-- 批量操作 -->
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<th colspan="5" class="tableLeft">
|
||||||
|
<el-button type="primary" size="mini" @click="addNewGoods">{{ '添加' }}
|
||||||
|
</el-button>
|
||||||
|
</th>
|
||||||
|
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
<table v-for="item in allData" v-show="item.orderType == isArea" :key="item.orderType" class="table_b">
|
||||||
|
<tr style="border-top: 0">
|
||||||
|
<td style="border: 0" />
|
||||||
|
<td colspan="2">原等级</td>
|
||||||
|
<td colspan="2">{{ '商品名称' }}</td>
|
||||||
|
<td colspan="2">{{ '商品数量' }}</td>
|
||||||
|
<td colspan="2">升级等级</td>
|
||||||
|
|
||||||
|
<td colspan="2" style="border: 0" />
|
||||||
|
</tr>
|
||||||
|
<tr v-for="(ctem, cndex) in item.acAddUpgradeRuleConfigParams" :key="cndex">
|
||||||
|
<td style="border: 0" />
|
||||||
|
<td colspan="2">
|
||||||
|
<el-select
|
||||||
|
v-model="ctem.originalLevel"
|
||||||
|
clearable
|
||||||
|
:placeholder="'请选择'"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="grade in gradeRangList"
|
||||||
|
:key="grade.pkId"
|
||||||
|
:label="grade.gradeName"
|
||||||
|
:value="grade.pkId"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</td>
|
||||||
|
<td colspan="2">
|
||||||
|
<el-select v-model="ctem.pkWares" size="medium" filterable :placeholder="'请选择'">
|
||||||
|
<el-option v-for="item in allGoods" :key="item.pkId" :label="item.waresName" :value="item.pkId">
|
||||||
|
<span style="float: left">{{ item.waresName }}</span>
|
||||||
|
<span style="float: right; color: #8492a6; font-size: 13px">{{
|
||||||
|
item.waresCode
|
||||||
|
}}</span>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</td>
|
||||||
|
<td colspan="2">
|
||||||
|
<el-input-number v-model="ctem.quantity" :min="1" :controls="false" />
|
||||||
|
</td>
|
||||||
|
<td colspan="2">
|
||||||
|
<el-select
|
||||||
|
v-model="ctem.upgradeLevel"
|
||||||
|
clearable
|
||||||
|
:placeholder="'请选择'"
|
||||||
|
>
|
||||||
|
<el-option v-for="grade in gradeRangList" :key="grade.pkId" :label="grade.gradeName" :value="grade.pkId" />
|
||||||
|
</el-select>
|
||||||
|
</td>
|
||||||
|
<td colspan="2" style="border: 0">
|
||||||
|
<div class="tableAdd">
|
||||||
|
<img src="@/assets/images/iconpop.png" alt="" @click="reduceRow(cndex)">
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import * as api from '@/api/giftGoods.js'
|
||||||
|
|
||||||
|
import { getgradeRanglist } from '@/api/level'
|
||||||
|
export default {
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dialogVisible: false,
|
||||||
|
ggVisible: false,
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 50
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
|
||||||
|
allData: [], // 全部数据
|
||||||
|
areaList: [
|
||||||
|
{
|
||||||
|
'value': 1,
|
||||||
|
'label': '注册专区'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 2,
|
||||||
|
'label': '升级专区'
|
||||||
|
}
|
||||||
|
], // 全部专区
|
||||||
|
allGoods: [], // 全部商品
|
||||||
|
isArea: '',
|
||||||
|
plcz: {},
|
||||||
|
select: {}, // 产品筛选
|
||||||
|
dialogList: [], // 产品数组
|
||||||
|
selectData: [], // 选中
|
||||||
|
skuList: [], // 规格数组
|
||||||
|
selSkuList: '',
|
||||||
|
selSkuNameList: '',
|
||||||
|
selIndex: '',
|
||||||
|
showCndex: '',
|
||||||
|
showIndex: '',
|
||||||
|
pageData: {},
|
||||||
|
queryData: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getgradeRanglist()
|
||||||
|
this.initData()
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getgradeRanglist() {
|
||||||
|
getgradeRanglist().then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.gradeRangList = res.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
initData(data) {
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
this.allData = JSON.parse(JSON.stringify(data))
|
||||||
|
} else {
|
||||||
|
this.allData = []
|
||||||
|
this.areaList.forEach((item) => {
|
||||||
|
this.allData.push({
|
||||||
|
orderType: item.value,
|
||||||
|
acAddUpgradeRuleConfigParams: []
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.isArea = this.areaList[0].value
|
||||||
|
},
|
||||||
|
|
||||||
|
getData() {
|
||||||
|
api
|
||||||
|
.waresList({
|
||||||
|
specialArea: this.isArea
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
this.allGoods = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
setArea(val) {
|
||||||
|
this.isArea = val
|
||||||
|
api
|
||||||
|
.waresList({
|
||||||
|
specialArea: this.isArea
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
this.allGoods = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
reduceRow(index) {
|
||||||
|
this.allData.forEach((item) => {
|
||||||
|
if (this.isArea == item.orderType) {
|
||||||
|
item.acAddUpgradeRuleConfigParams.splice(index, 1)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
addNewGoods() {
|
||||||
|
this.allData.forEach((item) => {
|
||||||
|
if (this.isArea === item.orderType) {
|
||||||
|
item.acAddUpgradeRuleConfigParams.push({
|
||||||
|
pkWares: '',
|
||||||
|
pkWaresName: '',
|
||||||
|
quantity: '',
|
||||||
|
originalLevel: '',
|
||||||
|
upgradeLevel: ''
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
tableRowClassName({ row, rowIndex }) {
|
||||||
|
if (rowIndex % 2 == 1) {
|
||||||
|
return 'warning-row'
|
||||||
|
} else if (rowIndex % 2 == 0) {
|
||||||
|
return 'success-row'
|
||||||
|
}
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
// .page {
|
||||||
|
// padding: 20px;
|
||||||
|
// background: #f9f9f9;
|
||||||
|
// font-size: 14px;
|
||||||
|
.main_a {
|
||||||
|
// height: calc(100vh - 124px);
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: column;
|
||||||
|
// height: calc(100vh - 164px);
|
||||||
|
// height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
height: calc(100vh - 164px);
|
||||||
|
padding-bottom: 20px;
|
||||||
|
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// }
|
||||||
|
.footer {
|
||||||
|
height: 68px;
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 0px -3px 20px 0px rgba(204, 204, 204, 0.5);
|
||||||
|
// margin: 0 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.thebtn1 {
|
||||||
|
background: #3181e5;
|
||||||
|
color: #ffffff;
|
||||||
|
padding: 9px 45px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.thebtn2 {
|
||||||
|
background: #cccccc;
|
||||||
|
color: #ffffff;
|
||||||
|
padding: 9px 45px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333333;
|
||||||
|
padding: 0 20px;
|
||||||
|
border-left: 5px solid #c8161d;
|
||||||
|
margin: 20px 0 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xian {
|
||||||
|
height: 1px;
|
||||||
|
background: rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.demo-ruleForm {
|
||||||
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-date-editor--datetimerange {
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexed {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexed_l {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
padding: 0 20px;
|
||||||
|
margin-top: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
background: #fff;
|
||||||
|
border-collapse: collapse;
|
||||||
|
border: 1px solid #cccccc;
|
||||||
|
border-spacing: 0;
|
||||||
|
table-layout: fixed;
|
||||||
|
border-collapse: collapse;
|
||||||
|
// 合并内外边距
|
||||||
|
// (去除表格单元格默认的2个像素内外边距*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_b {
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
padding: 10px 10px;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid #cccccc;
|
||||||
|
overflow: hidden;
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 10px 10px;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid #cccccc;
|
||||||
|
border-top: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableFlex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.tableFlex_i {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
::v-deep .el-input__inner {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableAdd {
|
||||||
|
width: 50px;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 19px;
|
||||||
|
height: 19px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableAddPro {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 19px;
|
||||||
|
height: 19px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableLeft {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabList {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px 0px 0 20px;
|
||||||
|
|
||||||
|
.tabList_i {
|
||||||
|
padding: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabAct {
|
||||||
|
background: #108ee9;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.clearBtm {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cpHeight {
|
||||||
|
height: 50vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blueCor {
|
||||||
|
color: #589ff8;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-input__icon {
|
||||||
|
line-height: 33px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-button {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,376 @@
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="page">
|
||||||
|
<div class="topbox">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in topList"
|
||||||
|
:key="index"
|
||||||
|
class="levelList_i"
|
||||||
|
:class="tabActive == item.id ? 'act' : ''"
|
||||||
|
@click.prevent="handleLink(item.id)"
|
||||||
|
>
|
||||||
|
{{ item.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="main">
|
||||||
|
<div v-show="tabActive == 0">
|
||||||
|
<div class="tit">基本信息</div>
|
||||||
|
<div class="xian" />
|
||||||
|
<el-form
|
||||||
|
ref="ruleForm"
|
||||||
|
:model="ruleForm"
|
||||||
|
:rules="rules"
|
||||||
|
label-width="auto"
|
||||||
|
class="demo-ruleForm"
|
||||||
|
>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'活动名称'" prop="actName">
|
||||||
|
<el-input
|
||||||
|
v-model="ruleForm.actName"
|
||||||
|
clearable
|
||||||
|
:disabled="lookOver"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="16">
|
||||||
|
<el-form-item :label="'活动说明'" prop="actExplain">
|
||||||
|
<editor
|
||||||
|
ref="sptwEditor"
|
||||||
|
v-model="ruleForm.actExplain"
|
||||||
|
:read-only="lookOver"
|
||||||
|
:min-height="196"
|
||||||
|
:upload-url="uploadImgUrl"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'活动封面'" prop="actCover">
|
||||||
|
<imageUpload v-model="ruleForm.actCover" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'活动时间'" prop="ruleFormTime">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="ruleForm.ruleFormTime"
|
||||||
|
:disabled="lookOver"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
type="daterange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item :label="'展示时间'" prop="ruleFormTime1">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="ruleForm.ruleFormTime1"
|
||||||
|
:disabled="lookOver"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
type="daterange"
|
||||||
|
:range-separator="'至'"
|
||||||
|
:start-placeholder="'开始日期'"
|
||||||
|
:end-placeholder="'结束日期'"
|
||||||
|
@change="changeTime1"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<UpdateInfo v-show="tabActive == 2" ref="updateInfo" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div v-show="controlType != 4" class="footer">
|
||||||
|
<el-button size="small" class="cancelBtn" @click="$router.back()">
|
||||||
|
{{ '取消' }}</el-button>
|
||||||
|
<el-button size="small" class="sureBtn" @click="submit('ruleForm')">
|
||||||
|
{{ '确认' }}</el-button>
|
||||||
|
</div>
|
||||||
|
<!-- </div> -->
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Editor from '@/components/Editor'
|
||||||
|
|
||||||
|
import * as api from '@/api/giftGoods.js'
|
||||||
|
import ImageUpload from '@/components/ImageUpload'
|
||||||
|
import UpdateInfo from '@/views/marketing/shoppingUpgrade/update'
|
||||||
|
import { updateShoppingUpgradeList, getShoppingUpgradeDetail } from '@/api/activity.js'
|
||||||
|
export default {
|
||||||
|
name: 'AddDirectPushUpgrade',
|
||||||
|
components: {
|
||||||
|
ImageUpload,
|
||||||
|
UpdateInfo,
|
||||||
|
Editor
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabActive: 0,
|
||||||
|
topList: [
|
||||||
|
{
|
||||||
|
name: '基本信息',
|
||||||
|
id: 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '加购升级',
|
||||||
|
id: 2
|
||||||
|
}
|
||||||
|
],
|
||||||
|
uploadImgUrl: process.env.VUE_APP_BASE_API + '/system/upload',
|
||||||
|
ruleForm: {
|
||||||
|
ruleFormTime: [],
|
||||||
|
ruleFormTime1: [],
|
||||||
|
actName: '',
|
||||||
|
actExplain: '',
|
||||||
|
actCover: ''
|
||||||
|
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
actName: [
|
||||||
|
{ required: true, message: '请输入活动名称', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
actExplain: [
|
||||||
|
{ required: true, message: '请输入活动说明', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
actCover: [
|
||||||
|
{ required: true, message: '请上传活动封面', trigger: 'change' }
|
||||||
|
],
|
||||||
|
ruleFormTime: [
|
||||||
|
{ required: true, message: '请选择活动时间', trigger: 'change' }
|
||||||
|
],
|
||||||
|
ruleFormTime1: [
|
||||||
|
{ required: true, message: '请选择展示时间', trigger: 'change' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
lookOver: false,
|
||||||
|
gradeList: [],
|
||||||
|
awardsList: [],
|
||||||
|
registList: [],
|
||||||
|
pkId: '',
|
||||||
|
repurchaseCouponsShowList: [],
|
||||||
|
controlType: '',
|
||||||
|
addData: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData()
|
||||||
|
// （1=新增,2=修改,3=删除）4查看
|
||||||
|
if (
|
||||||
|
this.$route.query.controlType == 4 ||
|
||||||
|
this.$route.query.controlType == 3
|
||||||
|
) {
|
||||||
|
this.lookOver = true
|
||||||
|
} else {
|
||||||
|
this.lookOver = false
|
||||||
|
}
|
||||||
|
this.controlType = this.$route.query.controlType
|
||||||
|
this.pkId = this.$route.query.pkId || ''
|
||||||
|
if (this.pkId) {
|
||||||
|
this.getDetails()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
splitDate(date) {
|
||||||
|
return date.split(' ')[0]
|
||||||
|
},
|
||||||
|
getDetails() {
|
||||||
|
getShoppingUpgradeDetail({
|
||||||
|
pkId: this.pkId
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
this.addData = res.data
|
||||||
|
this.$set(this.ruleForm, 'actName', res.data.actName)
|
||||||
|
this.$set(
|
||||||
|
this.ruleForm,
|
||||||
|
'actExplain',
|
||||||
|
res.data.actExplain
|
||||||
|
)
|
||||||
|
this.$set(this.ruleForm, 'actCover', res.data.actCover)
|
||||||
|
this.ruleForm.pkId = res.data.pkId
|
||||||
|
this.ruleForm.actStartDate = res.data.actStartDate
|
||||||
|
this.ruleForm.actEndDate = res.data.actEndDate
|
||||||
|
this.ruleForm.disStartDate = res.data.disStartDate
|
||||||
|
this.ruleForm.disEndDate = res.data.disEndDate
|
||||||
|
const actStartDate = this.splitDate(res.data.actStartDate)
|
||||||
|
const actEndDate = this.splitDate(res.data.actEndDate)
|
||||||
|
const disStartDate = this.splitDate(res.data.disStartDate)
|
||||||
|
const disEndDate = this.splitDate(res.data.disEndDate)
|
||||||
|
this.$set(this.ruleForm, 'ruleFormTime', [
|
||||||
|
actStartDate,
|
||||||
|
actEndDate
|
||||||
|
])
|
||||||
|
this.$set(this.ruleForm, 'ruleFormTime1', [
|
||||||
|
disStartDate,
|
||||||
|
disEndDate
|
||||||
|
])
|
||||||
|
|
||||||
|
this.$refs.updateInfo.initData(
|
||||||
|
this.addData.acAddUpgradeConfigParams || []
|
||||||
|
)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 切换tab
|
||||||
|
handleLink(id) {
|
||||||
|
this.tabActive = id
|
||||||
|
},
|
||||||
|
// 单选
|
||||||
|
|
||||||
|
changeTime(val) {
|
||||||
|
this.ruleForm.actStartDate = val[0]
|
||||||
|
this.ruleForm.actEndDate = val[1]
|
||||||
|
},
|
||||||
|
changeTime1(val) {
|
||||||
|
this.ruleForm.disStartDate = val[0]
|
||||||
|
this.ruleForm.disEndDate = val[1]
|
||||||
|
},
|
||||||
|
getData() {
|
||||||
|
api.awardsList().then((res) => {
|
||||||
|
this.awardsList = res.rows
|
||||||
|
})
|
||||||
|
api.gradeList().then((res) => {
|
||||||
|
this.gradeList = res.rows
|
||||||
|
})
|
||||||
|
api.registerPowerState().then((res) => {
|
||||||
|
this.registList = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs['ruleForm'].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
const obj = Object.assign(
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
controlType: this.controlType,
|
||||||
|
activityParam: {
|
||||||
|
...this.ruleForm,
|
||||||
|
actStartDate: this.ruleForm.actStartDate + ' 00:00:00',
|
||||||
|
actEndDate: this.ruleForm.actEndDate + ' 23:59:59',
|
||||||
|
disStartDate: this.ruleForm.disStartDate + ' 00:00:00',
|
||||||
|
disEndDate: this.ruleForm.disEndDate + ' 23:59:59'
|
||||||
|
},
|
||||||
|
acAddUpgradeConfigParam:
|
||||||
|
this.$refs.updateInfo.allData
|
||||||
|
// authorityList: this.$refs.updateInfo.form.waresAuthorityList
|
||||||
|
}
|
||||||
|
)
|
||||||
|
updateShoppingUpgradeList(obj).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message({
|
||||||
|
message: res.msg || '操作成功',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
this.$router.back()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.page {
|
||||||
|
padding: 20px;
|
||||||
|
background: #f9f9f9;
|
||||||
|
font-size: 14px;
|
||||||
|
.main_a {
|
||||||
|
height: calc(100vh - 144px);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.main {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
// height: calc(100vh - 124px);
|
||||||
|
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
|
||||||
|
}
|
||||||
|
::v-deep .el-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
height: 68px;
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 0px -3px 20px 0px rgba(204, 204, 204, 0.5);
|
||||||
|
// margin: 0 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
.thebtn1 {
|
||||||
|
background: #3181e5;
|
||||||
|
color: #ffffff;
|
||||||
|
padding: 9px 45px;
|
||||||
|
}
|
||||||
|
.thebtn2 {
|
||||||
|
background: #cccccc;
|
||||||
|
color: #ffffff;
|
||||||
|
padding: 9px 45px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tit {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333333;
|
||||||
|
padding: 0 20px;
|
||||||
|
border-left: 5px solid #c8161d;
|
||||||
|
margin: 20px 0 10px 0;
|
||||||
|
}
|
||||||
|
.xian {
|
||||||
|
height: 1px;
|
||||||
|
background: rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.demo-ruleForm {
|
||||||
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
::v-deep .el-date-editor--datetimerange {
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
.flexed {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.flexed_l {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.topbox {
|
||||||
|
align-items: center;
|
||||||
|
padding: 0px 0 15px 0;
|
||||||
|
display: flex;
|
||||||
|
// background: skyblue;
|
||||||
|
.levelList_i {
|
||||||
|
margin-left: 20px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0 5px;
|
||||||
|
width: 88px;
|
||||||
|
height: 34px;
|
||||||
|
border-radius: 17px;
|
||||||
|
border: 1px solid #cccccc;
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: MicrosoftYaHei;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
.act {
|
||||||
|
color: #ffffff;
|
||||||
|
background: #c8161d;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item {
|
||||||
|
margin-bottom: 20px !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue