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.
333 lines
8.8 KiB
333 lines
8.8 KiB
<template>
|
|
<div class="edit_add_page">
|
|
<div class="content">
|
|
<el-form ref="form" :model="form" label-width="100px">
|
|
<div class="detail_title">基础信息</div>
|
|
|
|
<el-form-item label="活动名称:">
|
|
<el-input v-model="form.seckillName" maxlength="20" placeholder="请输入活动名称" :disabled="unStart" />
|
|
</el-form-item>
|
|
<el-form-item label="备注:">
|
|
<el-input v-model="form.remark" maxlength="200" type="textarea" placeholder="请输入活动介绍" :disabled="unStart"
|
|
style="width: 400px;" />
|
|
</el-form-item>
|
|
<!-- :picker-options="pickerOptions" -->
|
|
<el-form-item label="报名时间:">
|
|
<el-date-picker v-model="date2" type="datetimerange" range-separator="至" start-placeholder="开始时间"
|
|
end-placeholder="结束时间" value-format="yyyy-MM-dd HH:mm:ss" :disabled="applyEnd" />
|
|
<p class="timeInfo">报名时间不能交叉且报名时间不能大于活动时间</p>
|
|
</el-form-item>
|
|
<el-form-item label="活动时间:">
|
|
<el-date-picker v-model="date1" type="datetimerange" range-separator="至" start-placeholder="开始时间"
|
|
end-placeholder="结束时间" value-format="yyyy-MM-dd HH:mm:ss" :disabled="applyEnd" />
|
|
<p class="timeInfo">平台活动时间不能交叉并且活动时间不能小于报名时间</p>
|
|
</el-form-item>
|
|
<el-form-item label="活动保证金:">
|
|
<el-radio-group v-model="form.ifBond">
|
|
<el-radio :label="1" :disabled="unStart">需要</el-radio>
|
|
<el-radio :label="0" :disabled="unStart">不需要</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.ifBond === 1" label="保证金金额:">
|
|
<el-input v-model="form.bondMoney" maxlength="9" placeholder="请输入活动保证金金额" :disabled="unStart" />
|
|
</el-form-item>
|
|
<div class="detail_title">优惠规则</div>
|
|
|
|
<el-form-item label="直降金额:">
|
|
<el-input v-model="form.seckillMoney" maxlength="9" placeholder="请输入活动名称" :disabled="unStart" />
|
|
</el-form-item>
|
|
<el-form-item label="是否限购:">
|
|
<el-radio-group v-model="form.ifLimit">
|
|
<el-radio :label="2" :disabled="unStart">限购</el-radio>
|
|
<el-radio :label="1" :disabled="unStart">不限购</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.ifLimit === 2" label="限购(件/人):">
|
|
<el-input v-model="form.limitNumber" maxlength="9" placeholder="请输入限购数量" :disabled="unStart" />
|
|
</el-form-item>
|
|
<el-form-item label="优惠券叠加:">
|
|
<el-radio-group v-model="form.ifAdd">
|
|
<el-radio :label="1" :disabled="unStart">叠加</el-radio>
|
|
<el-radio :label="0" :disabled="unStart">不叠加</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<div class="footer">
|
|
<div class="btn_list">
|
|
<span @click="cancel">取消</span>
|
|
<span @click="save">保存</span>
|
|
<span @click="reset">重置</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
// import { activeAdd, activeUpdate, activeGetById } from '@/api/active'
|
|
import {
|
|
getSeckillDetail,
|
|
editSeckillData,
|
|
addSeckillData
|
|
} from '@/api/active/active_seckill.js'
|
|
import Form from './module'
|
|
export default {
|
|
props: {
|
|
activityForm: {
|
|
type: Object,
|
|
default: () => { }
|
|
},
|
|
isEdit: {
|
|
type: Number,
|
|
default: 0
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
form: new Form(),
|
|
date1: [], // 活动时间
|
|
date2: [], // 报名时间
|
|
type: false,
|
|
title: ''
|
|
}
|
|
},
|
|
computed: {
|
|
// 其他修改
|
|
unStart() {
|
|
const t = this.isEdit ? this.activityForm : null
|
|
return t && !(t.state === 0)
|
|
},
|
|
// 时间修改
|
|
applyEnd() {
|
|
const t = this.isEdit ? this.activityForm : null
|
|
return t && (t.state === 3 || t.state === 4)
|
|
}
|
|
},
|
|
watch: {
|
|
isEdit: {
|
|
handler(nVal, oVal) {
|
|
if (nVal) {
|
|
this.getDetails()
|
|
} else {
|
|
this.reset()
|
|
}
|
|
},
|
|
deep: true
|
|
},
|
|
activityForm: {
|
|
handler(nVal, oVal) {
|
|
if (nVal) {
|
|
this.getDetails()
|
|
}
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
if (this.isEdit) { // 初始化watch无法监听isEdit，手动获取数据
|
|
this.getDetails()
|
|
}
|
|
},
|
|
methods: {
|
|
// 查询详情请
|
|
async getDetails() {
|
|
const res = await getSeckillDetail({ seckillId: this.activityForm.seckillId })
|
|
if (JSON.stringify(res.data) !== '{}') {
|
|
this.form = res.data
|
|
this.date1 = [res.data.startTime, res.data.endTime]
|
|
this.date2 = [res.data.signStartTime, res.data.signEndTime]
|
|
}
|
|
},
|
|
cancel() { this.$emit('cancel') },
|
|
refersh() { this.$emit('refersh') },
|
|
save() {
|
|
const params = Object.assign({}, this.form, {
|
|
startTime: this.date1[0] || '',
|
|
endTime: this.date1[1] || '',
|
|
signStartTime: this.date2[0] || '',
|
|
signEndTime: this.date2[1] || '',
|
|
bondMoney: this.form.bondMoney * 1
|
|
})
|
|
let errMsg = ''
|
|
if (params.seckillName === '') {
|
|
errMsg += ' 活动名称 '
|
|
}
|
|
if (params.signStartTime === '' || params.signEndTime === '') {
|
|
errMsg += ' 报名时间 '
|
|
}
|
|
if (params.startTime === '' || params.endTime === '') {
|
|
errMsg += ' 活动时间 '
|
|
}
|
|
if (errMsg.length !== 0) {
|
|
this.$message.error(`请输入${errMsg}`)
|
|
return
|
|
}
|
|
if (this.isEdit) {
|
|
// 修改
|
|
return editSeckillData(
|
|
Object.assign(params, { seckillId: this.activityForm.seckillId })
|
|
).then(res => {
|
|
if (res.code === '') {
|
|
this.$message({
|
|
message: '修改成功',
|
|
type: 'success'
|
|
})
|
|
this.reset()
|
|
this.refersh()
|
|
}
|
|
})
|
|
}
|
|
// 添加
|
|
return addSeckillData(params).then(res => {
|
|
if (res.code === '') {
|
|
this.$message({
|
|
message: '新增成功',
|
|
type: 'success'
|
|
})
|
|
this.reset()
|
|
this.refersh()
|
|
}
|
|
})
|
|
},
|
|
reset() {
|
|
this.form = new Form()
|
|
this.date1 = []
|
|
this.date2 = []
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss' scoped>
|
|
.edit_add_page {
|
|
padding: 0px;
|
|
|
|
.content {
|
|
overflow: hidden;
|
|
|
|
.detail_title {
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
padding-left: 10px;
|
|
line-height: 16px;
|
|
margin-bottom: 15px;
|
|
margin-top: 10px;
|
|
position: relative;
|
|
|
|
&::before {
|
|
content: "";
|
|
height: 16px;
|
|
width: 4px;
|
|
background-color: #183ECD;
|
|
position: absolute;
|
|
left: 0px;
|
|
display: block;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
::v-deep .el-form-item__label {
|
|
vertical-align: middle;
|
|
float: left;
|
|
padding: 0 12px 0 0;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
|
font-size: 14px;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
color: #404F64;
|
|
line-height: 36px;
|
|
text-align: left;
|
|
}
|
|
|
|
.el-form {
|
|
.el-form-item {
|
|
label.el-form-item__label {
|
|
font-size: 16px !important;
|
|
color: red !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.photo {
|
|
padding: 70px 100px;
|
|
|
|
.avatar-uploader {
|
|
width: 180px;
|
|
|
|
.el-icon-plus,
|
|
img {
|
|
width: 180px;
|
|
height: 180px;
|
|
line-height: 180px;
|
|
border: 1px #bbb solid;
|
|
border-radius: 4px 4px 0px 4px;
|
|
margin-bottom: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
img {
|
|
border: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.footer {
|
|
height: 80px;
|
|
line-height: 80px;
|
|
font-size: 24px;
|
|
position: relative;
|
|
border-top: 1px solid #e0e5eb;
|
|
|
|
.btn_list {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
height: 36px;
|
|
|
|
span {
|
|
padding: 0;
|
|
margin: 0;
|
|
width: 68px;
|
|
height: 36px;
|
|
line-height: 36px;
|
|
text-align: center;
|
|
display: inline-block;
|
|
/* font-size: 16px; */
|
|
border-radius: 4px;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
font-size: 14px;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
}
|
|
|
|
&:nth-child(1) {
|
|
background: rgba(255, 255, 255, 1);
|
|
order: 1px solid rgba(224, 229, 235, 1);
|
|
margin-right: 10px;
|
|
border: 1px solid rgba(224, 229, 235, 1);
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
background: #183ECD;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.timeInfo {
|
|
font-size: 12px;
|
|
color: #999999;
|
|
}
|
|
|
|
.el-input {
|
|
width: 400px;
|
|
}
|
|
}
|
|
</style>
|