336 lines
12 KiB
Vue
336 lines
12 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
|
|
<div class="filter-container">
|
|
<el-input clearable @keyup.enter.native="fetchData" style="width: 200px;" class="filter-item" placeholder="砍价ID" v-model="searchData.id">
|
|
</el-input>
|
|
<el-input clearable @keyup.enter.native="fetchData" style="width: 200px;" class="filter-item" placeholder="商品ID" v-model="searchData.goodsId">
|
|
</el-input>
|
|
<el-select clearable style="width: 200px" class="filter-item" v-model="searchData.status" placeholder="状态">
|
|
<el-option label="正常" value="0"></el-option>
|
|
<el-option label="禁用" value="1"></el-option>
|
|
</el-select>
|
|
<el-date-picker type="date" placeholder="开始时间起" v-model="searchData.dateAddBegin" style="width: 200px;" class="filter-item"></el-date-picker>
|
|
<el-date-picker type="date" placeholder="开始时间止" v-model="searchData.dateAddEnd" style="width: 200px;" class="filter-item"></el-date-picker>
|
|
<el-date-picker type="date" placeholder="截止时间起" v-model="searchData.dateEndBegin" style="width: 200px;" class="filter-item"></el-date-picker>
|
|
<el-date-picker type="date" placeholder="截止时间止" v-model="searchData.dateEndEnd" style="width: 200px;" class="filter-item"></el-date-picker>
|
|
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="fetchData">搜索</el-button>
|
|
<el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate" type="success" icon="el-icon-edit">添加</el-button>
|
|
</div>
|
|
|
|
<el-table :data="list" v-loading.body="listLoading" element-loading-text="Loading" border fit highlight-current-row empty-text="暂无数据" @selection-change="handleSelectionChange">
|
|
<el-table-column type="selection" align="center" width="55" row-key="id"></el-table-column>
|
|
<el-table-column prop="id" label="砍价ID"></el-table-column>
|
|
<el-table-column prop="goodsId" label="商品ID"></el-table-column>
|
|
<el-table-column prop="number" label="数量（份）"></el-table-column>
|
|
<el-table-column prop="originalPrice" label="原价"></el-table-column>
|
|
<el-table-column prop="minPrice" label="底价"></el-table-column>
|
|
<el-table-column label="砍价金额">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.helpPriceMin }} - {{ scope.row.helpPriceMax }} 元
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="statusStr" label="状态"></el-table-column>
|
|
<el-table-column prop="dateAdd" label="开始时间"></el-table-column>
|
|
<el-table-column prop="dateEnd" label="截止时间"></el-table-column>
|
|
<el-table-column label="操作">
|
|
<template slot-scope="scope">
|
|
<el-button type="text" @click="handleUpdate(scope.row.id)">编辑</el-button>
|
|
<el-button type="text" @click="delData(scope.row.id)" style="color:red">删除</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentChange"
|
|
:current-page="page"
|
|
:page-sizes="[10, 20, 50, 100]"
|
|
:page-size="pageSize"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="totalRow" style="margin-top:20px;">
|
|
</el-pagination>
|
|
|
|
<el-dialog :title="pushData.dialogTitle" :visible.sync="pushData.dialogFormVisible" :close-on-click-modal="false" :close-on-press-escape="false">
|
|
<el-form :rules="rules" ref="addEditPopForm" :model="pushData" label-position="left" label-width="100px">
|
|
<el-form-item label="商品ID" prop="goodsId" >
|
|
<el-input v-model.number="pushData.goodsId" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="总份数" prop="number" >
|
|
<el-input v-model.number="pushData.number" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="原价" prop="originalPrice" >
|
|
<el-input v-model.number="pushData.originalPrice" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="底价" prop="minPrice" >
|
|
<el-input v-model.number="pushData.minPrice" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="砍价金额">
|
|
<el-col :span="6">
|
|
<el-form-item prop="helpPriceMin">
|
|
<el-input v-model.number="pushData.helpPriceMin" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col class="line" :span="2" style="text-align:center;">-</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item prop="helpPriceMax">
|
|
<el-input v-model.number="pushData.helpPriceMax" clearable @keyup.enter.native="handleCreateSave"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="10"> 砍价一次随机减少的金额范围</el-col>
|
|
</el-form-item>
|
|
<el-form-item label="状态" prop="status" >
|
|
<el-select v-model="pushData.status" placeholder="请选择">
|
|
<el-option label="正常" value="0"></el-option>
|
|
<el-option label="禁用" value="1"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="开始时间" prop="dateAddStr" >
|
|
<el-date-picker v-model="pushData.dateAddStr" clearable type="datetime" placeholder="点击选择" value-format="yyyy-MM-dd HH:mm:ss">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item label="截止时间" prop="dateEndStr" >
|
|
<el-date-picker v-model="pushData.dateEndStr" clearable type="datetime" placeholder="点击选择" value-format="yyyy-MM-dd HH:mm:ss">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="pushData.dialogFormVisible = false">取消</el-button>
|
|
<el-button type="primary" @click="handleCreateSave">确定</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { fetchDataList, info, delData, saveData } from '@/api/kanjia'
|
|
import { Message, MessageBox } from 'element-ui'
|
|
import { mapGetters } from 'vuex'
|
|
|
|
export default {
|
|
computed: {
|
|
...mapGetters([
|
|
'centerUserBase'
|
|
])
|
|
},
|
|
data() {
|
|
return {
|
|
page:1,
|
|
pageSize:10,
|
|
totalRow:0,
|
|
|
|
rules: {
|
|
goodsId: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'integer', message: '必须为数字'}
|
|
],
|
|
number: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'integer', message: '必须为数字'}
|
|
],
|
|
originalPrice: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'number', message: '必须为数字'}
|
|
],
|
|
minPrice: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'number', message: '必须为数字'}
|
|
],
|
|
helpPriceMin: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'number', message: '必须为数字'}
|
|
],
|
|
helpPriceMax: [
|
|
{ required: true, message: '不能为空'},
|
|
{ type:'number', message: '必须为数字'}
|
|
],
|
|
status: [
|
|
{ required: true, message: '不能为空'}
|
|
],
|
|
dateAddStr: [
|
|
{ required: true, message: '不能为空'}
|
|
],
|
|
dateEndStr: [
|
|
{ required: true, message: '不能为空'}
|
|
],
|
|
},
|
|
|
|
searchData:{
|
|
id:undefined,
|
|
goodsId:undefined,
|
|
status:undefined,
|
|
dateAddBegin:undefined,
|
|
dateAddEnd:undefined,
|
|
dateEndBegin:undefined,
|
|
dateEndEnd:undefined,
|
|
},
|
|
|
|
pushData: {
|
|
dialogTitle : undefined,
|
|
dialogFormVisible:false,
|
|
|
|
id:undefined,
|
|
goodsId:undefined,
|
|
number:undefined,
|
|
originalPrice:undefined,
|
|
minPrice:undefined,
|
|
helpPriceMin:undefined,
|
|
helpPriceMax:undefined,
|
|
status:undefined,
|
|
dateAddStr:undefined,
|
|
dateEndStr:undefined
|
|
},
|
|
|
|
multipleSelection: [],
|
|
list: null,
|
|
listLoading: true,
|
|
statisticsData:{}
|
|
}
|
|
},
|
|
created() {
|
|
this.pushDataTmp = Object.assign({}, this.pushData)
|
|
this.fetchData()
|
|
},
|
|
mounted() {
|
|
|
|
},
|
|
methods: {
|
|
handleSizeChange(val) {
|
|
this.pageSize = val;
|
|
this.fetchData();
|
|
},
|
|
handleCurrentChange(val) {
|
|
this.page = val
|
|
this.fetchData()
|
|
},
|
|
handleSelectionChange(val) {
|
|
this.multipleSelection = val
|
|
},
|
|
fetchData() {
|
|
this.list = null
|
|
this.listLoading = true
|
|
fetchDataList(this.page, this.pageSize, this.searchData).then(response => {
|
|
if (response.code == 0) {
|
|
this.list = response.data.result
|
|
this.totalRow = response.data.totalRow
|
|
}
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
handleCreate(){
|
|
this.pushData = Object.assign({}, this.pushDataTmp)
|
|
this.pushData.dialogTitle = '增加砍价设置'
|
|
this.pushData.dialogFormVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs['addEditPopForm'].clearValidate()
|
|
})
|
|
},
|
|
handleUpdate(id){
|
|
info(id).then(res => {
|
|
if (res.code != 0) {
|
|
Message({
|
|
message: res.msg,
|
|
type: 'error',
|
|
duration: 3 * 1000
|
|
})
|
|
} else {
|
|
this.pushData = Object.assign({}, this.pushDataTmp, res.data, {dateAddStr:res.data.dateAdd, dateEndStr:res.data.dateEnd})
|
|
this.pushData.dialogTitle = '修改砍价设置'
|
|
this.pushData.dialogFormVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs['addEditPopForm'].clearValidate()
|
|
})
|
|
}
|
|
}).catch(e=>{
|
|
console.error(e);
|
|
})
|
|
},
|
|
handleCreateSave(){
|
|
this.$refs['addEditPopForm'].validate((valid) => {
|
|
if (valid) {
|
|
saveData(this.pushData).then((res) => {
|
|
this.pushData.dialogFormVisible = false
|
|
if (res.code == 0) {
|
|
Message({
|
|
message: '操作成功',
|
|
type: 'success',
|
|
duration: 1 * 1000,
|
|
onClose: () => {
|
|
this.fetchData()
|
|
}
|
|
})
|
|
} else {
|
|
Message({
|
|
message: res.msg,
|
|
type: 'error',
|
|
duration: 3 * 1000
|
|
})
|
|
}
|
|
}).catch(e=>{
|
|
console.error(e);
|
|
})
|
|
}
|
|
})
|
|
},
|
|
statistics(){
|
|
statistics().then(res => {
|
|
// 弹框点击确定调整支付宝付款
|
|
this.statisticsData = res.data
|
|
})
|
|
},
|
|
delData(id){
|
|
this.$confirm('删除无法恢复, 是否继续?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
delData(id).then(res => {
|
|
Message({
|
|
message: '删除成功',
|
|
type: 'success',
|
|
duration: 1 * 1000,
|
|
onClose: () => {
|
|
this.fetchData()
|
|
}
|
|
})
|
|
})
|
|
}).catch(() => {});
|
|
},
|
|
delDataMore(){
|
|
if (!this.multipleSelection.length) {
|
|
Message({
|
|
message: '请先选择需要删除的数据',
|
|
type: 'error',
|
|
duration: 1 * 1000
|
|
})
|
|
return
|
|
}
|
|
this.$confirm('删除无法恢复, 是否继续?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
|
|
this.multipleSelection.forEach(obj => {
|
|
delData(obj.id).then(res => {
|
|
this.fetchData()
|
|
})
|
|
})
|
|
}).catch(() => {});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style rel="stylesheet/scss" lang="scss">
|
|
.filter-container {
|
|
padding-bottom: 10px;
|
|
.filter-item {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
|
|
</style>
|