Skip to content

C
cloud-platform-ui
Commit f9c92f4c authored by guoyou's avatar guoyou
Browse files
Options

快捷筛选样式

parent 58112273
Hide whitespace changes
Inline Side-by-side
Showing with 806 additions and 685 deletions
src/views/cunponManagements/cunponManagement.vue
View file @ f9c92f4c
<template> <template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody"> <div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div> <div>
<div class="filter-container" ref="filter-container"> <div class="filter-container" ref="filter-container">
<el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="50px"> <el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="50px">
<el-row> <el-row>
<el-col :span="5"> <el-form-item label="标题">
<el-form-item label="标题"> <el-input v-model.number="listQuery.title" placeholder="请输入标题"></el-input>
<el-input v-model.number="listQuery.title" placeholder="请输入标题"></el-input> </el-form-item>
</el-form-item> <el-form-item>
</el-col> <el-select class="filter-item" v-model="listQuery.channel" placeholder="类型">
<el-col :span="5"> <el-option key label="全部" value></el-option>
<el-form-item> <el-option
<el-select class="filter-item" v-model="listQuery.channel" placeholder="类型"> v-for="(item,index) in channelType"
<el-option key="" label="全部" value=""> </el-option> :key="index"
<el-option v-for="(item,index) in channelType" :key="index" :label="item.val" :value="item.id"> </el-option> :label="item.val"
</el-select> :value="item.id"
</el-form-item> ></el-option>
</el-col> </el-select>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button> </el-form-item>
<el-button class="filter-item" type="primary" @click="addCunpon" style="float: right;">+ 添加优惠券</el-button> <el-col :span="5"></el-col>
</el-row> <el-col :span="5"></el-col>
</el-form> <el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
</div> <el-button class="filter-item" type="primary" @click="addCunpon" style="float: right;">+ 添加优惠券</el-button>
<el-table :key='tableKey' :data="list" border fit highlight-current-row style="width: 100%;"> </el-row>
<el-table-column type="index" align="center" label="ID" width="100"> </el-form>
<template scope="scope"> </div>
<span>{{scope.row.id}}</span> <el-table :key="tableKey" :data="list" border fit highlight-current-row style="width: 100%;">
</template> <el-table-column type="index" align="center" label="ID" width="100">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="优惠券标题"> <span>{{scope.row.id}}</span>
<template scope="scope"> </template>
<span>{{scope.row.title}}</span> </el-table-column>
</template> <el-table-column align="center" label="优惠券标题">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="类型"> <span>{{scope.row.title}}</span>
<template scope="scope"> </template>
<span v-if="scope.row.channel==0">全平台</span> </el-table-column>
<span v-if="scope.row.channel==1">租车</span> <el-table-column align="center" label="类型">
<span v-if="scope.row.channel==2">旅游</span> <template scope="scope">
<span v-if="scope.row.channel==3">营地</span> <span v-if="scope.row.channel==0">全平台</span>
<span v-if="scope.row.channel==4">会员</span> <span v-if="scope.row.channel==1">租车</span>
</template> <span v-if="scope.row.channel==2">旅游</span>
</el-table-column> <span v-if="scope.row.channel==3">营地</span>
<el-table-column align="center" label="金额"> <span v-if="scope.row.channel==4">会员</span>
<template scope="scope"> </template>
<span>{{scope.row.usedAmount}}</span> </el-table-column>
</template> <el-table-column align="center" label="金额">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="已领取"> <span>{{scope.row.usedAmount}}</span>
<template scope="scope"> </template>
<span>{{scope.row.takeCount}}</span> </el-table-column>
</template> <el-table-column align="center" label="已领取">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="已使用"> <span>{{scope.row.takeCount}}</span>
<template scope="scope"> </template>
<span>{{scope.row.usedCount}}</span> </el-table-column>
</template> <el-table-column align="center" label="已使用">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="创建时间"> <span>{{scope.row.usedCount}}</span>
<template scope="scope"> </template>
<span>{{scope.row.crtTimeStr}}</span> </el-table-column>
</template> <el-table-column align="center" label="创建时间">
</el-table-column> <template scope="scope">
<el-table-column align="center" label="操作" width="150" fixed="right"> <span>{{scope.row.crtTimeStr}}</span>
<template scope="scope"> </template>
<el-button size="small" class="el-button el-button--text el-button--small" @click="handleUpdate(scope.row)">编辑</el-button> </el-table-column>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" @click="deleteHandler(scope.row)">删除</el-button> <el-table-column align="center" label="操作" width="150" fixed="right">
</template> <template scope="scope">
</el-table-column> <el-button
</el-table> size="small"
<div v-show="!listLoading" class="pagination-container"> class="el-button el-button--text el-button--small"
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" @click="handleUpdate(scope.row)"
:current-page.sync="listQuery.page" :page-sizes="[10,20,30,40,50]" :page-size="listQuery.limit" >编辑</el-button>
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination> <el-button
</div> class="el-button el-button--text el-button--small"
</div> style="color:red;"
size="small"
@click="deleteHandler(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="listQuery.page"
:page-sizes="[10,20,30,40,50]"
:page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<!-- 优惠券编辑 --> <!-- 优惠券编辑 -->
<el-dialog :title="modalTitle" :visible.sync="editDialogVisible"> <el-dialog :title="modalTitle" :visible.sync="editDialogVisible">
<el-form :model="formdata" :rules="rules" ref="form" label-width="110px"> <el-form :model="formdata" :rules="rules" ref="form" label-width="110px">
<div style="font-weight: bold;">基础设置</div> <div style="font-weight: bold;">基础设置</div>
<hr style="background-color:#e5e5e5;height:1px;border:none;margin:10px 0"> <hr style="background-color:#e5e5e5;height:1px;border:none;margin:10px 0" />
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="优惠券标题" prop="title"> <el-form-item label="优惠券标题" prop="title">
<el-input v-model="formdata.title" placeholder="请输入优惠券标题" :disabled="isUpdate"></el-input> <el-input v-model="formdata.title" placeholder="请输入优惠券标题" :disabled="isUpdate"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="适用人群"> <el-form-item label="适用人群">
<el-radio-group v-model="formdata.user_type_name" size="medium"> <el-radio-group v-model="formdata.user_type_name" size="medium">
<el-radio-button label="普通用户" :disabled="formdata.user_type_name=='会员用户'&&isUpdate"></el-radio-button> <el-radio-button label="普通用户" :disabled="formdata.user_type_name=='会员用户'&&isUpdate"></el-radio-button>
<el-radio-button label="会员用户" :disabled="formdata.user_type_name=='普通用户'&&isUpdate"></el-radio-button> <el-radio-button label="会员用户" :disabled="formdata.user_type_name=='普通用户'&&isUpdate"></el-radio-button>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="优惠金额"> <el-form-item label="优惠金额">
<el-input v-model="formdata.usedAmount" placeholder="请输入优惠金额" :disabled="isUpdate"></el-input> <el-input v-model="formdata.usedAmount" placeholder="请输入优惠金额" :disabled="isUpdate"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="优惠方式"> <el-form-item label="优惠方式">
<el-select class="filter-item" v-model="formdata.type" placeholder="请选择" style="width:110px" :disabled="isUpdate"> <el-select
<el-option v-for="(item,index) in cunponType " :key="index" :label="item.val" class="filter-item"
:value="item.id" :disabled="item.id==2"></el-option> v-model="formdata.type"
</el-select> placeholder="请选择"
<span v-if="formdata.type==1">满</span> style="width:110px"
<el-input v-model="formdata.withAmount" placeholder="请输入金额" style="width:100px" v-if="formdata.type==1" :disabled="isUpdate"></el-input> :disabled="isUpdate"
<span v-if="formdata.type==1">可用</span> >
</el-form-item> <el-option
</el-col> v-for="(item,index) in cunponType "
</el-row> :key="index"
<el-row> :label="item.val"
<el-col :span="24"> :value="item.id"
<el-form-item label="有效期"> :disabled="item.id==2"
<el-radio-group v-model="formdata.valid_type_name" size="medium"> ></el-option>
<el-radio-button label="绝对时效" :disabled="formdata.valid_type_name=='相对时效'&&isUpdate"></el-radio-button> </el-select>
<el-radio-button label="相对时效" :disabled="formdata.valid_type_name=='绝对时效'&&isUpdate"></el-radio-button> <span v-if="formdata.type==1">满</span>
<el-radio-button label="永久时效" :disabled="formdata.valid_type_name=='永久时效'&&isUpdate"></el-radio-button> <el-input
</el-radio-group> v-model="formdata.withAmount"
<div style="display:inline-block" v-show="formdata.valid_type_name=='绝对时效'"> placeholder="请输入金额"
<el-date-picker v-model="formdata.validStartTimeStr" type = "date" placeholder = "开始时间" :disabled="isUpdate" :picker-options="pickerOptionsStart"></el-date-picker> style="width:100px"
<span> - </span> v-if="formdata.type==1"
<el-date-picker v-model="formdata.validEndTimeStr" type = "date" placeholder = "结束时间" :disabled="isUpdate" :picker-options="pickerOptionsEnd1"></el-date-picker> :disabled="isUpdate"
</div> ></el-input>
<div style="display:inline-block" v-show="formdata.valid_type_name=='相对时效'"> <span v-if="formdata.type==1">可用</span>
<span>领取后</span> </el-form-item>
<el-input v-model="formdata.validDays" placeholder="请输入金额" style="width:100px" :disabled="isUpdate" type="number"></el-input> </el-col>
<span>天有效</span> </el-row>
</div> <el-row>
</el-form-item> <el-col :span="24">
</el-col> <el-form-item label="有效期">
</el-row> <el-radio-group v-model="formdata.valid_type_name" size="medium">
<el-row> <el-radio-button label="绝对时效" :disabled="formdata.valid_type_name=='相对时效'&&isUpdate"></el-radio-button>
<el-col :span="12"> <el-radio-button label="相对时效" :disabled="formdata.valid_type_name=='绝对时效'&&isUpdate"></el-radio-button>
<el-form-item label="是否可转赠"> <el-radio-button label="永久时效" :disabled="formdata.valid_type_name=='永久时效'&&isUpdate"></el-radio-button>
<el-radio-group v-model="formdata.cangive" size="medium"> </el-radio-group>
<el-radio-button label="是" disabled=""></el-radio-button> <div style="display:inline-block" v-show="formdata.valid_type_name=='绝对时效'">
<el-radio-button label="否" ></el-radio-button> <el-date-picker
</el-radio-group> v-model="formdata.validStartTimeStr"
</el-form-item> type="date"
</el-col> placeholder="开始时间"
<el-col :span="12"> :disabled="isUpdate"
<el-form-item label="跳转链接"> :picker-options="pickerOptionsStart"
<el-input v-model="formdata.url" placeholder="请输入跳转链接"></el-input> ></el-date-picker>
</el-form-item> <span>-</span>
</el-col> <el-date-picker
</el-row> v-model="formdata.validEndTimeStr"
<el-row> type="date"
<el-form-item label="优惠券图片" :style="{display:'block'}"> placeholder="结束时间"
<el-upload :disabled="isUpdate"
class="upload-demo" :picker-options="pickerOptionsEnd1"
:headers="getHeaderWithToken" ></el-date-picker>
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'" </div>
:show-file-list="false" <div style="display:inline-block" v-show="formdata.valid_type_name=='相对时效'">
:on-success="handleAvatarSuccess" <span>领取后</span>
list-type="picture"> <el-input
<img v-if="$utils.isString(formdata.icon) && !$utils.isEmpty(formdata.icon)" :src="formdata.icon" v-model="formdata.validDays"
style="width:300px;max-height: 100px;"> placeholder="请输入金额"
<i v-else class="el-icon-plus avatar-uploader-icon" style="width:100px"
style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"></i> :disabled="isUpdate"
</el-upload> type="number"
</el-form-item> ></el-input>
</el-row> <span>天有效</span>
<div style="font-weight: bold;">高级设置</div> </div>
<hr style="background-color:#e5e5e5;height:1px;border:none;margin:10px 0"> </el-form-item>
<el-row> </el-col>
<el-col :span="12"> </el-row>
<el-form-item label="优惠券类别" > <el-row>
<el-select class="filter-item" v-model="formdata.used" placeholder="请选择" :disabled="isUpdate"> <el-col :span="12">
<el-option v-for="(item,index) in usedType " :key="index" :label="item.val" <el-form-item label="是否可转赠">
:value="item.id"></el-option> <el-radio-group v-model="formdata.cangive" size="medium">
</el-select> <el-radio-button label="是" disabled></el-radio-button>
</el-form-item> <el-radio-button label="否"></el-radio-button>
</el-col> </el-radio-group>
</el-row> </el-form-item>
<el-row> </el-col>
<el-col :span="24"> <el-col :span="12">
<el-form-item label="适用范围" > <el-form-item label="跳转链接">
<el-select class="filter-item" v-model="formdata.channel" placeholder="请选择" :disabled="isUpdate"> <el-input v-model="formdata.url" placeholder="请输入跳转链接"></el-input>
<el-option v-for="(item,index) in channelType " :key="index" :label="item.val" </el-form-item>
:value="item.id"></el-option> </el-col>
</el-select> </el-row>
</el-form-item> <el-row>
</el-col> <el-form-item label="优惠券图片" :style="{display:'block'}">
</el-row> <el-upload
<el-row> class="upload-demo"
<el-col :span="24"> :headers="getHeaderWithToken"
<el-form-item label="开始发放时间" > :action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
<el-radio-group v-model="formdata.startTimeName" size="medium"> :show-file-list="false"
<el-radio-button label="不限"></el-radio-button> :on-success="handleAvatarSuccess"
<el-radio-button label="自定义" ></el-radio-button> list-type="picture"
</el-radio-group> >
<div style="display:inline-block" v-show="formdata.startTimeName=='自定义'"> <img
<el-date-picker v-model="formdata.startTimeStr" type = "date" placeholder = "开始发放时间" :picker-options="pickerOptionsStart"></el-date-picker> v-if="$utils.isString(formdata.icon) && !$utils.isEmpty(formdata.icon)"
</div> :src="formdata.icon"
</el-form-item> style="width:300px;max-height: 100px;"
</el-col> />
</el-row> <i
<el-row> v-else
<el-col :span="24"> class="el-icon-plus avatar-uploader-icon"
<el-form-item label="结束发放时间" > style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"
<el-radio-group v-model="formdata.endTimeName" size="medium"> ></i>
<el-radio-button label="不限"></el-radio-button> </el-upload>
<el-radio-button label="自定义" ></el-radio-button> </el-form-item>
</el-radio-group> </el-row>
<div style="display:inline-block" v-show="formdata.endTimeName=='自定义'"> <div style="font-weight: bold;">高级设置</div>
<el-date-picker v-model="formdata.endTimeStr" type = "date" placeholder = "结束发放时间" :picker-options="pickerOptionsEnd"></el-date-picker> <hr style="background-color:#e5e5e5;height:1px;border:none;margin:10px 0" />
</div> <el-row>
</el-form-item> <el-col :span="12">
</el-col> <el-form-item label="优惠券类别">
</el-row> <el-select
<el-row> class="filter-item"
<el-col :span="12"> v-model="formdata.used"
<el-form-item label="最多发放数量" > placeholder="请选择"
<el-input v-model="formdata.quota" placeholder="请输入最多发放数量"></el-input> :disabled="isUpdate"
</el-form-item> >
</el-col> <el-option
</el-row> v-for="(item,index) in usedType "
<el-row> :key="index"
<el-col :span="12"> :label="item.val"
<el-form-item label="每人限领次数" > :value="item.id"
<el-input v-model="formdata.limitCollar" placeholder="请输入限领次数"></el-input> ></el-option>
</el-form-item> </el-select>
</el-col> </el-form-item>
</el-row> </el-col>
</el-form> </el-row>
<div slot="footer" class="dialog-footer"> <el-row>
<el-button @click="cancelHandel">取消</el-button> <el-col :span="24">
<el-button v-if="modalTitle=='优惠券添加'" type="primary" @click="create('form')">确 定</el-button> <el-form-item label="适用范围">
<el-button v-else type="primary" @click="update('form')">确 定</el-button> <el-select
</div> class="filter-item"
</el-dialog> v-model="formdata.channel"
</div> placeholder="请选择"
:disabled="isUpdate"
>
<el-option
v-for="(item,index) in channelType "
:key="index"
:label="item.val"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="开始发放时间">
<el-radio-group v-model="formdata.startTimeName" size="medium">
<el-radio-button label="不限"></el-radio-button>
<el-radio-button label="自定义"></el-radio-button>
</el-radio-group>
<div style="display:inline-block" v-show="formdata.startTimeName=='自定义'">
<el-date-picker
v-model="formdata.startTimeStr"
type="date"
placeholder="开始发放时间"
:picker-options="pickerOptionsStart"
></el-date-picker>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="结束发放时间">
<el-radio-group v-model="formdata.endTimeName" size="medium">
<el-radio-button label="不限"></el-radio-button>
<el-radio-button label="自定义"></el-radio-button>
</el-radio-group>
<div style="display:inline-block" v-show="formdata.endTimeName=='自定义'">
<el-date-picker
v-model="formdata.endTimeStr"
type="date"
placeholder="结束发放时间"
:picker-options="pickerOptionsEnd"
></el-date-picker>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="最多发放数量">
<el-input v-model="formdata.quota" placeholder="请输入最多发放数量"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="每人限领次数">
<el-input v-model="formdata.limitCollar" placeholder="请输入限领次数"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelHandel">取消</el-button>
<el-button v-if="modalTitle=='优惠券添加'" type="primary" @click="create('form')">确 定</el-button>
<el-button v-else type="primary" @click="update('form')">确 定</el-button>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框 import 'static/css/uploadImg.css' // 引入图片上传组件对话框
import { import { formatDate } from 'utils/dateFormattor'
formatDate
} from 'utils/dateFormattor';
import { import {
toEast8Date, toEast8Date,
deepCopyDate, deepCopyDate,
newEast8Date, newEast8Date,
convertDate2Str, convertDate2Str,
timestamp2Date, timestamp2Date,
getYMD getYMD
} from 'utils/dateUtils'; } from 'utils/dateUtils'
import {mapGetters} from 'vuex'; import { mapGetters } from 'vuex'
import { import { getToken } from 'utils/auth'
getToken import {
} from 'utils/auth'; cunponManagementList,
import { delObj,
cunponManagementList, getObj,
delObj, addObj
getObj, } from 'api/cunponManagements'
addObj import Element1 from '../admin/menu/components/element'
} from 'api/cunponManagements'; import ElRow from 'element-ui/packages/row/src/row'
import Element1 from "../admin/menu/components/element"; import ElCol from 'element-ui/packages/col/src/col'
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
export default { export default {
name: 'cunponManagement', name: 'cunponManagement',
components: { components: {
ElCol, ElCol,
ElRow, ElRow,
Element1, Element1
}, },
data() { data() {
return { return {
cunponType:[ cunponType: [
{ {
id:1, id: 1,
val:'满减卷' val: '满减卷'
},{ },
id:2, {
val:'叠加满减卷' id: 2,
},{ val: '叠加满减卷'
id:3, },
val:'无门槛卷' {
} id: 3,
], val: '无门槛卷'
usedType:[ }
{ ],
id:10, usedType: [
val:'店铺优惠卷' {
}, id: 10,
{ val: '店铺优惠卷'
id:11, },
val:'新人店铺卷' {
}, id: 11,
{ val: '新人店铺卷'
id:20, },
val:'商品优惠券' {
}, id: 20,
{ val: '商品优惠券'
id:30, },
val:'类目优惠券' {
}, id: 30,
{ val: '类目优惠券'
id:60, },
val:'平台优惠券' {
}, id: 60,
{ val: '平台优惠券'
id:61, },
val:'新人平台券' {
} id: 61,
], val: '新人平台券'
channelType:[ }
{ ],
id:0, channelType: [
val:'全平台' {
}, id: 0,
{ val: '全平台'
id:1, },
val:'租车' {
}, id: 1,
{ val: '租车'
id:2, },
val:'旅游' {
}, id: 2,
{ val: '旅游'
id:3, },
val:'营地' {
}, id: 3,
{ val: '营地'
id:4, },
val:'会员' {
} id: 4,
], val: '会员'
BASE_API: process.env.BASE_API, }
showLoadingBody: false, ],
// list: null, BASE_API: process.env.BASE_API,
total: null, showLoadingBody: false,
listLoading: true, // list: null,
listQuery: { total: null,
page: 1, listLoading: true,
limit: 20, listQuery: {
title: '',//标题 page: 1,
channel:'',//状态 limit: 20,
}, title: '', //标题
inline: true, channel: '' //状态
tableKey: 0, },
editDialogVisible:false, inline: true,
formdata:{}, tableKey: 0,
modalTitle:'', editDialogVisible: false,
isUpdate:false, formdata: {},
rules:{ modalTitle: '',
title: { isUpdate: false,
type: 'string', rules: {
required: true, title: {
message: '请输入标题', type: 'string',
trigger: 'blur' required: true,
}, message: '请输入标题',
}, trigger: 'blur'
list:[], }
pickerOptionsStart: { },
disabledDate(time) { list: [],
return time.getTime() < Date.now() - 8.64e7; pickerOptionsStart: {
} disabledDate(time) {
}, return time.getTime() < Date.now() - 8.64e7
// pickerOptionsStart: { }
// disabledDate: time => { },
// const endDateVal = new Date(this.formdata.endTimeStr).getTime() // pickerOptionsStart: {
// if (endDateVal) { // disabledDate: time => {
// return time.getTime() > endDateVal - 0 // const endDateVal = new Date(this.formdata.endTimeStr).getTime()
// } // if (endDateVal) {
// } // return time.getTime() > endDateVal - 0
// }, // }
pickerOptionsEnd: { // }
disabledDate: time => { // },
const beginDateVal = new Date(this.formdata.startTimeStr).getTime() pickerOptionsEnd: {
if (beginDateVal) { disabledDate: time => {
return time.getTime() < beginDateVal - 0 const beginDateVal = new Date(
} this.formdata.startTimeStr
} ).getTime()
}, if (beginDateVal) {
pickerOptionsEnd1: { return time.getTime() < beginDateVal - 0
disabledDate: time => { }
const beginDateVal = new Date(this.formdata.validStartTimeStr).getTime() }
if (beginDateVal) { },
return time.getTime() < beginDateVal - 0 pickerOptionsEnd1: {
} disabledDate: time => {
} const beginDateVal = new Date(
} this.formdata.validStartTimeStr
).getTime()
if (beginDateVal) {
return time.getTime() < beginDateVal - 0
}
}
}
}
},
created() {
this.getList()
},
computed: {
...mapGetters(['elements']),
getHeaderWithToken() {
return { Authorization: getToken() }
}
},
methods: {
/**
* 获取提现列表
* */
getList() {
this.listLoading = true
cunponManagementList(this.listQuery).then(response => {
let totalCountRs = undefined
let listRs = undefined
if (
!this.$utils.isEmpty(response.data.data) &&
this.$utils.isInteger(response.data.totalCount)
) {
listRs = response.data.data
totalCountRs = response.data.totalCount
listRs.map(function(item) {
item.crtTimeStr = timestamp2Date(item.crtTime)
})
}
this.listLoading = false
this.list = listRs
this.total = totalCountRs
})
},
handleFilter() {
this.listQuery.page = 1
this.$refs.queryForm.validate(valid => {
if (valid) {
this.getList()
} else {
return false
}
})
},
handleSizeChange(val) {
this.listQuery.limit = val
this.getList()
},
handleCurrentChange(val) {
this.listQuery.page = val
this.getList()
},
handleUpdate(row) {
var that = this
that.modalTitle = '优惠券编辑'
that.isUpdate = true
that.cleanForm()
getObj(row.id).then(response => {
console.log(response)
var item = response.data
item.user_type_name =
item.userType == 0 ? '普通用户' : '会员用户'
item.valid_type_name =
item.validType == 1
? '绝对时效'
: item.validType == 2
? '相对时效'
: '永久时效'
//相对时效的时间
if (item.validStartTime > 0) {
item.validStartTimeStr = getYMD(item.validStartTime)
} else {
item.validStartTimeStr = ''
}
if (item.validEndTime > 0) {
item.validEndTimeStr = getYMD(item.validEndTime)
} else {
item.validEndTimeStr = ''
}
//高级设置，发放时间
if (item.startTime > 0) {
item.startTimeStr = getYMD(item.startTime)
} else {
item.startTimeStr = ''
}
if (item.endTime > 0) {
item.endTimeStr = getYMD(item.endTime)
} else {
item.endTimeStr = ''
}
} item.startTimeName = item.startTime == 0 ? '不限' : '自定义'
}, item.endTimeName = item.endTime == 0 ? '不限' : '自定义'
created() { item.cangive = '否'
this.getList(); that.formdata = item
}, that.editDialogVisible = true
computed: { })
...mapGetters([ },
'elements' addCunpon() {
]), var that = this
getHeaderWithToken() { that.modalTitle = '优惠券添加'
return {Authorization: getToken()}; that.isUpdate = false
}, that.cleanForm()
}, console.log(that.formdata)
methods: { that.editDialogVisible = true
/** },
* 获取提现列表 deleteHandler(row) {
* */ this.$confirm('确定删除吗?', '提示', {
getList() { confirmButtonText: '确定',
this.listLoading = true; cancelButtonText: '取消',
cunponManagementList(this.listQuery).then(response => { type: 'warning'
let totalCountRs = undefined; }).then(() => {
let listRs = undefined; delObj(row.id).then(() => {
if (!this.$utils.isEmpty(response.data.data) && this.$utils.isInteger(response.data.totalCount)) { this.$notify({
listRs = response.data.data; title: '成功',
totalCountRs = response.data.totalCount; message: '删除成功',
listRs.map(function(item){ type: 'success',
item.crtTimeStr = timestamp2Date(item.crtTime); duration: 2000
}); })
} row.visible2 = false
this.listLoading = false; const index = this.list.indexOf(row)
this.list = listRs; this.list.splice(index, 1)
this.total = totalCountRs; })
}) })
},
/**
* 创建
* */
create(formName) {
var that = this
const set = this.$refs
set[formName].validate(valid => {
if (valid) {
that.formdata.userType =
that.formdata.user_type_name == '普通用户' ? 0 : 1
that.formdata.validType =
that.formdata.valid_type_name == '绝对时效'
? 1
: that.formdata.valid_type_name == '相对时效'
? 2
: 3
if (that.formdata.valid_type_name == '绝对时效') {
that.formdata.validStartTime = new Date(
this.formdata.validStartTimeStr
).getTime()
that.formdata.validEndTime = new Date(
this.formdata.validEndTimeStr
).getTime()
} else {
that.formdata.validStartTime = 0
that.formdata.validEndTime = 0
}
if (that.formdata.valid_type_name == '相对时效') {
if (that.formdata.validDays <= 0) {
this.$notify({
title: '警告',
message: '相对时效时间需大于0',
type: 'warning',
duration: 2000
})
return false
}
}
if (that.formdata.startTimeName == '自定义') {
that.formdata.startTime = new Date(
this.formdata.startTimeStr
).getTime()
} else {
that.formdata.startTime = 0
}
if (that.formdata.endTimeName == '自定义') {
that.formdata.endTime = new Date(
this.formdata.endTimeStr
).getTime()
} else {
that.formdata.endTime = 0
}
}, console.log(that.formdata)
handleFilter() { addObj(that.formdata).then(response => {
this.listQuery.page = 1; if (response.status === 200) {
this.$refs.queryForm.validate(valid => { this.editDialogVisible = false
if (valid) { this.getList()
this.getList(); this.$notify({
} else { title: '成功',
return false; message: '创建成功',
} type: 'success',
}); duration: 2000
}, })
handleSizeChange(val) { } else {
this.listQuery.limit = val; this.$notify({
this.getList(); title: '失败',
}, message: rsCode.msg[response.code]
handleCurrentChange(val) { ? rsCode.msg[response.code]
this.listQuery.page = val; : '操作失败！',
this.getList(); type: 'error',
}, duration: 2000
handleUpdate(row){ })
var that = this; }
that.modalTitle = '优惠券编辑'; })
that.isUpdate = true; } else {
that.cleanForm(); return false
getObj(row.id).then(response => { }
console.log(response) })
var item = response.data; },
item.user_type_name = item.userType==0?'普通用户':'会员用户'; /**
item.valid_type_name = item.validType==1?'绝对时效':item.validType==2?'相对时效':'永久时效'; * 编辑-更新
//相对时效的时间 * */
if(item.validStartTime>0){ update(formName) {
item.validStartTimeStr = getYMD(item.validStartTime); var that = this
}else{ const set = this.$refs
item.validStartTimeStr = ''; set[formName].validate(valid => {
} if (valid) {
if(item.validEndTime>0){ that.formdata.userType =
item.validEndTimeStr = getYMD(item.validEndTime); that.formdata.user_type_name == '普通用户' ? 0 : 1
}else{ that.formdata.validType =
item.validEndTimeStr = ''; that.formdata.valid_type_name == '绝对时效'
} ? 1
//高级设置，发放时间 : that.formdata.valid_type_name == '相对时效'
if(item.startTime>0){ ? 2
item.startTimeStr = getYMD(item.startTime); : 3
}else{
item.startTimeStr = '';
}
if(item.endTime>0){
item.endTimeStr = getYMD(item.endTime);
}else{
item.endTimeStr = '';
}
item.startTimeName=item.startTime==0?'不限':'自定义'; if (that.formdata.valid_type_name == '绝对时效') {
item.endTimeName=item.endTime==0?'不限':'自定义'; that.formdata.validStartTime = new Date(
item.cangive='否'; that.formdata.validStartTimeStr
that.formdata = item; ).getTime()
that.editDialogVisible = true; that.formdata.validEndTime = new Date(
}) that.formdata.validEndTimeStr
).getTime()
} else {
that.formdata.validStartTime = 0
that.formdata.validEndTime = 0
}
if (that.formdata.startTimeName == '自定义') {
that.formdata.startTime = new Date(
that.formdata.startTimeStr
).getTime()
} else {
that.formdata.startTime = 0
}
if (that.formdata.endTimeName == '自定义') {
that.formdata.endTime = new Date(
that.formdata.endTimeStr
).getTime()
} else {
that.formdata.endTime = 0
}
}, console.log(that.formdata)
addCunpon(){ addObj(that.formdata).then(response => {
var that = this; if (response.status === 200) {
that.modalTitle = '优惠券添加'; this.editDialogVisible = false
that.isUpdate = false; this.getList()
that.cleanForm(); this.$notify({
console.log(that.formdata) title: '成功',
that.editDialogVisible = true; message: '编辑成功',
}, type: 'success',
deleteHandler(row){ duration: 2000
this.$confirm('确定删除吗?', '提示', { })
confirmButtonText: '确定', } else {
cancelButtonText: '取消', this.$notify({
type: 'warning' title: '失败',
}).then(() => { message: rsCode.msg[response.code]
delObj(row.id).then(() => { ? rsCode.msg[response.code]
this.$notify({ : '操作失败！',
title: '成功', type: 'error',
message: '删除成功', duration: 2000
type: 'success', })
duration: 2000 }
}); })
row.visible2 = false; } else {
const index = this.list.indexOf(row); return false
this.list.splice(index, 1); }
}); })
}) },
}, /**
/** * 上传图片
* 创建 * @param file
* */ * @returns {boolean}
create(formName) { */
var that = this; beforeAvatarUpload(file) {
const set = this.$refs; const isJPG =
set[formName].validate(valid => { file.type === 'image/jpeg' || file.type === 'image/gif'
if (valid) { const isLt2M = file.size / 1024 / 1024 < 10
that.formdata.userType = that.formdata.user_type_name=='普通用户'?0:1;
that.formdata.validType = that.formdata.valid_type_name=='绝对时效'?1:that.formdata.valid_type_name=='相对时效'?2:3;
if(that.formdata.valid_type_name=='绝对时效'){
that.formdata.validStartTime = new Date(this.formdata.validStartTimeStr).getTime();
that.formdata.validEndTime = new Date(this.formdata.validEndTimeStr).getTime();
}else{
that.formdata.validStartTime = 0;
that.formdata.validEndTime = 0;
}
if(that.formdata.valid_type_name=='相对时效'){
if(that.formdata.validDays<=0){
this.$notify({
title: '警告',
message: '相对时效时间需大于0',
type: 'warning',
duration: 2000
});
return false
}
}
if(that.formdata.startTimeName=='自定义'){
that.formdata.startTime = new Date(this.formdata.startTimeStr).getTime();
}else{
that.formdata.startTime = 0
}
if(that.formdata.endTimeName=='自定义'){
that.formdata.endTime = new Date(this.formdata.endTimeStr).getTime();
}else{
that.formdata.endTime = 0
}
console.log(that.formdata) if (!isJPG) {
addObj(that.formdata) this.$message.error('上传图片只能是 JPG/GIF 格式!')
.then(response => { }
if (response.status === 200) { if (!isLt2M) {
this.editDialogVisible = false; this.$message.error('上传图片大小不能超过 10MB!')
this.getList(); }
this.$notify({ this.showLoadingBody = true
title: '成功', return isJPG && isLt2M
message: '创建成功', },
type: 'success', handleAvatarSuccess(res, file) {
duration: 2000 this.formdata.icon = res.data
}); this.showLoadingBody = false
} else { },
this.$notify({ /**
title: '失败', * 弹框-取消
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败！', * */
type: 'error', cancelHandel() {
duration: 2000 this.cleanForm()
}); this.editDialogVisible = false
} },
}); /**
} else { * 清空表单
return false; * */
} cleanForm() {
}); this.formdata = {
}, title: '',
/** user_type_name: '普通用户',
* 编辑-更新 usedAmount: '',
* */ type: 1,
update(formName) { withAmount: '',
var that = this; valid_type_name: '绝对时效',
const set = this.$refs; validStartTimeStr: '',
set[formName].validate(valid => { validEndTimeStr: '',
if (valid) { validDays: 0,
that.formdata.userType = that.formdata.user_type_name=='普通用户'?0:1; cangive: '否',
that.formdata.validType = that.formdata.valid_type_name=='绝对时效'?1:that.formdata.valid_type_name=='相对时效'?2:3; url: '',
icon: '',
if(that.formdata.valid_type_name=='绝对时效'){ used: 61,
that.formdata.validStartTime = new Date(that.formdata.validStartTimeStr).getTime(); channel: 0,
that.formdata.validEndTime = new Date(that.formdata.validEndTimeStr).getTime(); startTimeName: '不限',
}else{ endTimeName: '不限',
that.formdata.validStartTime = 0; startTimeStr: '',
that.formdata.validEndTime = 0; endTimeStr: '',
} quota: '',
limitCollar: ''
if(that.formdata.startTimeName=='自定义'){ }
that.formdata.startTime = new Date(that.formdata.startTimeStr).getTime(); }
}else{ }
that.formdata.startTime = 0 }
}
if(that.formdata.endTimeName=='自定义'){
that.formdata.endTime = new Date(that.formdata.endTimeStr).getTime();
}else{
that.formdata.endTime = 0
}
console.log(that.formdata)
addObj(that.formdata)
.then(response => {
if (response.status === 200) {
this.editDialogVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '编辑成功',
type: 'success',
duration: 2000
});
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败！',
type: 'error',
duration: 2000
});
}
});
} else {
return false;
}
});
},
/**
* 上传图片
* @param file
* @returns {boolean}
*/
beforeAvatarUpload(file) {
const isJPG = file.type === 'image/jpeg' || file.type === 'image/gif';
const isLt2M = file.size / 1024 / 1024 < 10;
if (!isJPG) {
this.$message.error('上传图片只能是 JPG/GIF 格式!');
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 10MB!');
}
this.showLoadingBody = true;
return isJPG && isLt2M;
},
handleAvatarSuccess(res, file) {
this.formdata.icon = res.data;
this.showLoadingBody = false;
},
/**
* 弹框-取消
* */
cancelHandel(){
this.cleanForm();
this.editDialogVisible = false;
},
/**
* 清空表单
* */
cleanForm() {
this.formdata = {
title: '',
user_type_name:"普通用户",
usedAmount:'',
type:1,
withAmount:'',
valid_type_name:'绝对时效',
validStartTimeStr:'',
validEndTimeStr:'',
validDays:0,
cangive:'否',
url:'',
icon:'',
used:61,
channel:0,
startTimeName:'不限',
endTimeName:'不限',
startTimeStr:'',
endTimeStr:'',
quota:'',
limitCollar:''
}
},
}
}
</script> </script>
<style lang="" scope>
</style>
src/views/userManagement/userList/index.vue
View file @ f9c92f4c
<template> <template>
<div class="app-container calendar-list-container"> <div class="app-container calendar-list-container">
<div class="filter-container"> <div class="filter-container">
<el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="100px"> <el-form ref="queryForm" :inline="true" :model="listQuery">
<el-row> <el-row>
<el-form-item label="手机号"> <el-form-item label="手机号">
<el-input v-model.number="listQuery.mobile" placeholder="请输入手机号"></el-input> <el-input v-model.number="listQuery.mobile" placeholder="请输入手机号"></el-input>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment