zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

秒杀增加card，满额详情不展示操作列

master
程 2023-04-23 10:23:32 +08:00
parent 87b3cbe344
commit 9181befdf9
3 changed files with 130 additions and 303 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
buyer/src/pages/promotion/seckill.vue
View File

@ -6,12 +6,7 @@
<div class="promotion-decorate">限时秒杀</div> <div class="promotion-decorate">限时秒杀</div>
<ul class="time-line"> <ul class="time-line">
<template v-for="(time, index) in list"> <template v-for="(time, index) in list">
<li <li v-if="index < 5" @click="currIndex = index" :key="index" :class="{ currTimeline: currIndex === index }">
v-if="index < 5"
@click="currIndex = index"
:key="index"
:class="{ currTimeline: currIndex === index }"
>
<div>{{ time.timeLine + ":00" }}</div> <div>{{ time.timeLine + ":00" }}</div>
<div v-if="currIndex === index"> <div v-if="currIndex === index">
<p>{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}</p> <p>{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}</p>
@ -30,13 +25,8 @@
<!-- 秒杀商品列表 --> <!-- 秒杀商品列表 -->
<div class="goods-list"> <div class="goods-list">
<empty v-if="goodsList.length === 0" /> <empty v-if="goodsList.length === 0" />
<div <div v-else class="goods-show-info1" v-for="(item, index) in goodsList" :key="index"
v-else @click="goGoodsDetail(item.skuId, item.goodsId)">
class="goods-show-info1"
v-for="(item, index) in goodsList"
:key="index"
@click="goGoodsDetail(item.skuId, item.goodsId)"
>
<div class="goods-show-img"> <div class="goods-show-img">
<img width="200" height="200" :src="item.goodsImage" /> <img width="200" height="200" :src="item.goodsImage" />
</div> </div>
@ -53,42 +43,28 @@
<div class="goods-show-detail"> <div class="goods-show-detail">
<span>{{ item.goodsName }}</span> <span>{{ item.goodsName }}</span>
</div> </div>
<div <div class="goods-seckill-btn" :class="{
class="goods-seckill-btn" 'goods-seckill-btn-gray': nowHour < list[currIndex].timeLine,
:class="{ }">
'goods-seckill-btn-gray': nowHour < list[currIndex].timeLine,
}"
>
{{ nowHour >= list[currIndex].timeLine ? "立即抢购" : "即将开始" }} {{ nowHour >= list[currIndex].timeLine ? "立即抢购" : "即将开始" }}
</div> </div>
<div <div v-if="nowHour >= list[currIndex].timeLine && item.quantity <= item.salesNum"
v-if="nowHour >= list[currIndex].timeLine && item.quantity <= item.salesNum" class="goods-seckill-btn goods-seckill-btn-gray">
class="goods-seckill-btn goods-seckill-btn-gray"
>
已售罄 已售罄
</div> </div>
<div v-if="nowHour >= list[currIndex].timeLine" class="goods-show-num1"> <div v-if="nowHour >= list[currIndex].timeLine" class="goods-show-num1">
<span <span>已售{{
>已售{{ (item.quantity && item.quantity > 0
(item.quantity && item.quantity > 0 ? Math.ceil(
? Math.ceil( (item.salesNum / (item.quantity + item.salesNum)) * 100
(item.salesNum / (item.quantity + item.salesNum)) * 100 )
) : 100) + "%"
: 100) + "%" }}</span><Progress hide-info stroke-color="#df0021" style="width: 110px" class="ml_10" :percent="item.quantity && item.quantity > 0
}}</span ? Math.ceil(
><Progress (item.salesNum / (item.quantity + item.salesNum)) * 100
hide-info )
stroke-color="#df0021" : 100
style="width: 110px" " />
class="ml_10"
:percent="
item.quantity && item.quantity > 0
? Math.ceil(
(item.salesNum / (item.quantity + item.salesNum)) * 100
)
: 100
"
/>
</div> </div>
<div class="goods-show-seller"> <div class="goods-show-seller">
<span>{{ item.storeName }}</span> <span>{{ item.storeName }}</span>
@ -101,7 +77,7 @@
<script> <script>
import { seckillByDay } from "@/api/promotion"; import { seckillByDay } from "@/api/promotion";
export default { export default {
data() { data () {
return { return {
list: [], // 秒杀时段列表 list: [], // 秒杀时段列表
goodsList: [], // 商品列表 goodsList: [], // 商品列表
@ -112,19 +88,19 @@ export default {
nowHour: new Date().getHours(), // 当前小时数 nowHour: new Date().getHours(), // 当前小时数
}; };
}, },
beforeDestroy() { beforeDestroy () {
// 销毁前清除定时器 // 销毁前清除定时器
clearInterval(this.interval); clearInterval(this.interval);
}, },
watch: { watch: {
currIndex(val) { currIndex (val) {
clearInterval(this.interval); clearInterval(this.interval);
this.interval = null; this.interval = null;
this.nowHour = new Date().getHours(); this.nowHour = new Date().getHours();
this.countDown(val); this.countDown(val);
this.goodsList = this.list[val].seckillGoodsList; this.goodsList = this.list[val].seckillGoodsList;
}, },
diffSeconds(val) { diffSeconds (val) {
const hours = Math.floor(val / 3600); const hours = Math.floor(val / 3600);
// 当前秒数 / 60，向下取整 // 当前秒数 / 60，向下取整
// 获取到所有分钟数 3600 / 60 = 60分钟 // 获取到所有分钟数 3600 / 60 = 60分钟
@ -138,7 +114,7 @@ export default {
clearInterval(this.interval); clearInterval(this.interval);
this.interval = null; this.interval = null;
} }
function filteTime(time) { function filteTime (time) {
if (time < 10) { if (time < 10) {
return "0" + time; return "0" + time;
} else { } else {
@ -148,7 +124,7 @@ export default {
}, },
}, },
methods: { methods: {
getListByDay() { getListByDay () {
// 当天秒杀活动 // 当天秒杀活动
seckillByDay().then((res) => { seckillByDay().then((res) => {
if (res.success) { if (res.success) {
@ -158,7 +134,7 @@ export default {
} }
}); });
}, },
goGoodsDetail(skuId, goodsId) { goGoodsDetail (skuId, goodsId) {
// 跳转商品详情 // 跳转商品详情
let routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/goodsDetail", path: "/goodsDetail",
@ -166,7 +142,7 @@ export default {
}); });
window.open(routeUrl.href, "_blank"); window.open(routeUrl.href, "_blank");
}, },
countDown(currIndex) { countDown (currIndex) {
// 倒计时 // 倒计时
// 0点时间戳 // 0点时间戳
let zeroTime = new Date(new Date().toLocaleDateString()).getTime(); let zeroTime = new Date(new Date().toLocaleDateString()).getTime();
@ -191,13 +167,14 @@ export default {
}, 1000); }, 1000);
}, },
}, },
mounted() { mounted () {
this.getListByDay(); this.getListByDay();
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "../../assets/styles/goodsList.scss"; @import "../../assets/styles/goodsList.scss";
.goods-seckill-btn { .goods-seckill-btn {
position: absolute; position: absolute;
right: 0; right: 0;
@ -212,19 +189,23 @@ export default {
margin-bottom: 1px; margin-bottom: 1px;
margin-right: 1px; margin-right: 1px;
} }
.goods-seckill-btn-gray { .goods-seckill-btn-gray {
background-color: #666; background-color: #666;
} }
.promotion-decorate::before, .promotion-decorate::before,
.promotion-decorate::after { .promotion-decorate::after {
background-image: url("/src/assets/images/sprite@2x.png"); background-image: url("/src/assets/images/sprite@2x.png");
} }
.time-line { .time-line {
width: 1200px; width: 1200px;
height: 60px; height: 60px;
margin: 0 auto; margin: 0 auto;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
li { li {
padding: 0 30px; padding: 0 30px;
font-size: 16px; font-size: 16px;
@ -233,9 +214,11 @@ export default {
height: 100%; height: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
&:hover { &:hover {
cursor: pointer; cursor: pointer;
} }
.not-curr { .not-curr {
border: 1px solid #999; border: 1px solid #999;
border-radius: 20px; border-radius: 20px;
@ -245,18 +228,22 @@ export default {
font-weight: normal; font-weight: normal;
} }
} }
.currTimeline { .currTimeline {
background-color: $theme_color; background-color: $theme_color;
color: #fff; color: #fff;
> div:nth-child(1) {
>div:nth-child(1) {
font-size: 20px; font-size: 20px;
} }
> div:nth-child(2) {
>div:nth-child(2) {
font-size: 14px; font-size: 14px;
margin-left: 10px; margin-left: 10px;
} }
} }
} }
.goods-show-info1 { .goods-show-info1 {
width: 290px; width: 290px;
padding: 6px; padding: 6px;
@ -267,15 +254,18 @@ export default {
cursor: pointer; cursor: pointer;
background-color: #fff; background-color: #fff;
} }
.goods-show-info1:hover { .goods-show-info1:hover {
border: 1px solid #ccc; border: 1px solid #ccc;
box-shadow: 0px 0px 15px #ccc; box-shadow: 0px 0px 15px #ccc;
} }
.goods-show-img { .goods-show-img {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.ivu-progress-success .ivu-progress-bg { .ivu-progress-success .ivu-progress-bg {
background-color: #111fff; background-color: #111fff;
} }
</style> </style>

270
seller/src/views/promotion/full-discount/full-discount-add.vue
View File

@ -6,251 +6,101 @@
<h4>基本信息</h4> <h4>基本信息</h4>
<div class="form-item-view"> <div class="form-item-view">
<FormItem label="活动名称" prop="promotionName"> <FormItem label="活动名称" prop="promotionName">
<Input <Input type="text" v-model="form.promotionName" :disabled="form.promotionStatus != 'NEW'" placeholder="活动名称"
type="text" clearable style="width: 280px" />
v-model="form.promotionName"
:disabled="form.promotionStatus != 'NEW'"
placeholder="活动名称"
clearable
style="width: 280px"
/>
</FormItem> </FormItem>
<FormItem label="活动时间" prop="rangeTime"> <FormItem label="活动时间" prop="rangeTime">
<DatePicker <DatePicker type="datetimerange" v-model="form.rangeTime" :disabled="form.promotionStatus != 'NEW'"
type="datetimerange" format="yyyy-MM-dd HH:mm:ss" placeholder="请选择" :options="options" style="width: 280px">
v-model="form.rangeTime"
:disabled="form.promotionStatus != 'NEW'"
format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择"
:options="options"
style="width: 280px"
>
</DatePicker> </DatePicker>
</FormItem> </FormItem>
<FormItem label="活动描述" prop="description"> <FormItem label="活动描述" prop="description">
<Input <Input v-model="form.description" :disabled="form.promotionStatus != 'NEW'" type="textarea" :rows="4"
v-model="form.description" clearable style="width: 280px" />
:disabled="form.promotionStatus != 'NEW'"
type="textarea"
:rows="4"
clearable
style="width: 280px"
/>
</FormItem> </FormItem>
</div> </div>
<h4>优惠设置</h4> <h4>优惠设置</h4>
<div class="form-item-view"> <div class="form-item-view">
<FormItem label="优惠门槛" prop="fullMoney"> <FormItem label="优惠门槛" prop="fullMoney">
<Input <Input type="text" v-model="form.fullMoney" :disabled="form.promotionStatus != 'NEW'" placeholder="优惠门槛"
type="text" clearable style="width: 280px" />
v-model="form.fullMoney"
:disabled="form.promotionStatus != 'NEW'"
placeholder="优惠门槛"
clearable
style="width: 280px"
/>
<span class="describe">消费达到当前金额可以参与优惠</span> <span class="describe">消费达到当前金额可以参与优惠</span>
</FormItem> </FormItem>
<FormItem label="优惠方式"> <FormItem label="优惠方式">
<RadioGroup <RadioGroup type="button" button-style="solid" v-model="form.discountType">
type="button" <Radio :disabled="form.promotionStatus != 'NEW'" label="fullMinusFlag">减现金</Radio>
button-style="solid" <Radio :disabled="form.promotionStatus != 'NEW'" label="fullRateFlag">打折</Radio>
v-model="form.discountType"
>
<Radio
:disabled="form.promotionStatus != 'NEW'"
label="fullMinusFlag"
>减现金</Radio
>
<Radio
:disabled="form.promotionStatus != 'NEW'"
label="fullRateFlag"
>打折</Radio
>
</RadioGroup> </RadioGroup>
</FormItem> </FormItem>
<FormItem <FormItem v-if="form.discountType == 'fullMinusFlag'" label="优惠金额" prop="fullMinus">
v-if="form.discountType == 'fullMinusFlag'" <Input :disabled="form.promotionStatus != 'NEW'" type="text" v-model="form.fullMinus" placeholder="优惠金额"
label="优惠金额" clearable style="width: 280px" />
prop="fullMinus"
>
<Input
:disabled="form.promotionStatus != 'NEW'"
type="text"
v-model="form.fullMinus"
placeholder="优惠金额"
clearable
style="width: 280px"
/>
</FormItem> </FormItem>
<FormItem <FormItem v-if="form.discountType == 'fullRateFlag'" label="优惠折扣" prop="fullRate">
v-if="form.discountType == 'fullRateFlag'" <Input :disabled="form.promotionStatus != 'NEW'" type="text" v-model="form.fullRate" placeholder="优惠折扣"
label="优惠折扣" clearable style="width: 280px" />
prop="fullRate"
>
<Input
:disabled="form.promotionStatus != 'NEW'"
type="text"
v-model="form.fullRate"
placeholder="优惠折扣"
clearable
style="width: 280px"
/>
<span class="describe">优惠折扣为0-10之间数字，可有一位小数</span> <span class="describe">优惠折扣为0-10之间数字，可有一位小数</span>
</FormItem> </FormItem>
<FormItem label="额外赠送"> <FormItem label="额外赠送">
<Checkbox <Checkbox :disabled="form.promotionStatus != 'NEW'" v-model="form.freeFreightFlag">免邮费</Checkbox>
:disabled="form.promotionStatus != 'NEW'" <Checkbox :disabled="form.promotionStatus != 'NEW'" v-model="form.couponFlag">送优惠券</Checkbox>
v-model="form.freeFreightFlag" <Checkbox :disabled="form.promotionStatus != 'NEW'" v-model="form.giftFlag">送赠品</Checkbox>
>免邮费</Checkbox <Checkbox :disabled="form.promotionStatus != 'NEW'" v-if="Cookies.get('userInfoSeller') &&
> JSON.parse(Cookies.get('userInfoSeller')).selfOperated
<Checkbox " v-model="form.pointFlag">送积分</Checkbox>
:disabled="form.promotionStatus != 'NEW'"
v-model="form.couponFlag"
>送优惠券</Checkbox
>
<Checkbox
:disabled="form.promotionStatus != 'NEW'"
v-model="form.giftFlag"
>送赠品</Checkbox
>
<Checkbox
:disabled="form.promotionStatus != 'NEW'"
v-if="
Cookies.get('userInfoSeller') &&
JSON.parse(Cookies.get('userInfoSeller')).selfOperated
"
v-model="form.pointFlag"
>送积分</Checkbox
>
</FormItem> </FormItem>
<FormItem v-if="form.couponFlag" label="赠送优惠券" prop="couponId"> <FormItem v-if="form.couponFlag" label="赠送优惠券" prop="couponId">
<Select <Select v-model="form.couponId" :disabled="form.promotionStatus != 'NEW'" filterable
v-model="form.couponId" :remote-method="getCouponList" placeholder="输入优惠券名称搜索" :loading="couponLoading" style="width: 280px">
:disabled="form.promotionStatus != 'NEW'" <Option v-for="item in couponList" :value="item.id" :key="item.id">{{ item.couponName }}</Option>
filterable
:remote-method="getCouponList"
placeholder="输入优惠券名称搜索"
:loading="couponLoading"
style="width: 280px"
>
<Option
v-for="item in couponList"
:value="item.id"
:key="item.id"
>{{ item.couponName }}</Option
>
</Select> </Select>
</FormItem> </FormItem>
<FormItem v-if="form.giftFlag" label="赠品" prop="giftId"> <FormItem v-if="form.giftFlag" label="赠品" prop="giftId">
<Select <Select :disabled="form.promotionStatus != 'NEW'" v-model="form.giftId" filterable
:disabled="form.promotionStatus != 'NEW'" :remote-method="getGiftList" placeholder="输入赠品名称搜索" :loading="giftLoading" style="width: 280px">
v-model="form.giftId" <Option v-for="item in giftList" :value="item.id" :key="item.id">
filterable
:remote-method="getGiftList"
placeholder="输入赠品名称搜索"
:loading="giftLoading"
style="width: 280px"
>
<Option
v-for="item in giftList"
:value="item.id"
:key="item.id"
>
{{ item.goodsName }} {{ item.goodsName }}
</Option </Option>
>
</Select> </Select>
</FormItem> </FormItem>
<FormItem v-if="form.pointFlag" label="赠积分" prop="point"> <FormItem v-if="form.pointFlag" label="赠积分" prop="point">
<InputNumber <InputNumber :min="0" :disabled="form.promotionStatus != 'NEW'" v-model="form.point" type="number"
:min="0" style="width: 280px" />
:disabled="form.promotionStatus != 'NEW'"
v-model="form.point"
type="number"
style="width: 280px"
/>
</FormItem> </FormItem>
<FormItem label="使用范围" prop="scopeType"> <FormItem label="使用范围" prop="scopeType">
<RadioGroup <RadioGroup type="button" button-style="solid" v-model="form.scopeType">
type="button" <Radio :disabled="form.promotionStatus != 'NEW'" label="ALL">全品类</Radio>
button-style="solid" <Radio :disabled="form.promotionStatus != 'NEW'" label="PORTION_GOODS">指定商品</Radio>
v-model="form.scopeType"
>
<Radio :disabled="form.promotionStatus != 'NEW'" label="ALL"
>全品类</Radio
>
<Radio
:disabled="form.promotionStatus != 'NEW'"
label="PORTION_GOODS"
>指定商品</Radio
>
</RadioGroup> </RadioGroup>
</FormItem> </FormItem>
<FormItem <FormItem style="width: 100%" v-if="form.scopeType == 'PORTION_GOODS'">
style="width: 100%" <div style="display: flex; margin-bottom: 10px" v-if="form.promotionStatus == 'NEW'">
v-if="form.scopeType == 'PORTION_GOODS'"
>
<div
style="display: flex; margin-bottom: 10px"
v-if="form.promotionStatus == 'NEW'"
>
<Button type="primary" @click="openSkuList">选择商品</Button> <Button type="primary" @click="openSkuList">选择商品</Button>
<Button <Button type="error" ghost style="margin-left: 10px" @click="delSelectGoods">批量删除</Button>
type="error"
ghost
style="margin-left: 10px"
@click="delSelectGoods"
>批量删除</Button
>
</div> </div>
<Table <Table border :columns="columns" :data="form.promotionGoodsList" @on-selection-change="changeSelect">
border
:columns="columns"
:data="form.promotionGoodsList"
@on-selection-change="changeSelect"
>
<template slot-scope="{ row }" slot="QRCode"> <template slot-scope="{ row }" slot="QRCode">
<img <img :src="row.QRCode || '../../../assets/lili.png'" width="50px" height="50px" alt="" />
:src="row.QRCode || '../../../assets/lili.png'"
width="50px"
height="50px"
alt=""
/>
</template> </template>
<template slot-scope="{ index }" slot="action"> <template slot-scope="{ index }" slot="action">
<Button <Button type="error" :disabled="form.promotionStatus != 'NEW' && !!id" size="small" ghost
type="error" @click="delGoods(index)">删除</Button>
:disabled="form.promotionStatus != 'NEW' && !!id"
size="small"
ghost
@click="delGoods(index)"
>删除</Button
>
</template> </template>
</Table> </Table>
</FormItem> </FormItem>
<div> <div>
<Button type="text" @click="closeCurrentPage">返回</Button> <Button type="text" @click="closeCurrentPage">返回</Button>
<Button <Button type="primary" :disabled="form.promotionStatus != 'NEW' && !!id" :loading="submitLoading"
type="primary" @click="handleSubmit">提交</Button>
:disabled="form.promotionStatus != 'NEW' && !!id"
:loading="submitLoading"
@click="handleSubmit"
>提交</Button
>
</div> </div>
</div> </div>
</div> </div>
</Form> </Form>
</Card> </Card>
<sku-select <sku-select ref="skuSelect" @selectedGoodsData="selectedGoodsData"></sku-select>
ref="skuSelect"
@selectedGoodsData="selectedGoodsData"
></sku-select>
</div> </div>
</template> </template>
@ -270,7 +120,7 @@ export default {
components: { components: {
skuSelect, skuSelect,
}, },
data() { data () {
const checkPrice = (rule, value, callback) => { const checkPrice = (rule, value, callback) => {
if (!value && value !== 0) { if (!value && value !== 0) {
return callback(new Error("面额不能为空")); return callback(new Error("面额不能为空"));
@ -369,29 +219,31 @@ export default {
}, },
], ],
options: { options: {
disabledDate(date) { disabledDate (date) {
return date && date.valueOf() < Date.now() - 86400000; return date && date.valueOf() < Date.now() - 86400000;
}, },
}, },
}; };
}, },
async mounted() { async mounted () {
if (this.id) { if (this.id) {
this.getDetail(); this.getDetail();
this.columns.shift()
this.columns.pop()
} }
await this.getCouponList(); await this.getCouponList();
await this.getGiftList(); await this.getGiftList();
}, },
methods: { methods: {
// 关闭当前页面 // 关闭当前页面
closeCurrentPage() { closeCurrentPage () {
this.$store.commit("removeTag", "full-cut-detail"); this.$store.commit("removeTag", "full-cut-detail");
localStorage.storeOpenedList = JSON.stringify( localStorage.storeOpenedList = JSON.stringify(
this.$store.state.app.storeOpenedList this.$store.state.app.storeOpenedList
); );
this.$router.go(-1); this.$router.go(-1);
}, },
openSkuList() { openSkuList () {
// 显示商品选择器 // 显示商品选择器
this.$refs.skuSelect.open("goods"); this.$refs.skuSelect.open("goods");
let data = JSON.parse(JSON.stringify(this.form.promotionGoodsList)); let data = JSON.parse(JSON.stringify(this.form.promotionGoodsList));
@ -400,7 +252,7 @@ export default {
}); });
this.$refs.skuSelect.goodsData = data; this.$refs.skuSelect.goodsData = data;
}, },
getDetail() { getDetail () {
// 获取活动详情 // 获取活动详情
getFullDiscountById(this.id).then((res) => { getFullDiscountById(this.id).then((res) => {
console.log(res); console.log(res);
@ -422,7 +274,7 @@ export default {
}); });
}, },
/** 保存 */ /** 保存 */
handleSubmit() { handleSubmit () {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
const params = JSON.parse(JSON.stringify(this.form)); const params = JSON.parse(JSON.stringify(this.form));
@ -486,11 +338,11 @@ export default {
}); });
}, },
changeSelect(e) { changeSelect (e) {
// 已选商品批量选择 // 已选商品批量选择
this.selectedGoods = e; this.selectedGoods = e;
}, },
delSelectGoods() { delSelectGoods () {
// 多选删除商品 // 多选删除商品
if (this.selectedGoods.length <= 0) { if (this.selectedGoods.length <= 0) {
this.$Message.warning("您还未选择要删除的数据"); this.$Message.warning("您还未选择要删除的数据");
@ -512,11 +364,11 @@ export default {
}, },
}); });
}, },
delGoods(index) { delGoods (index) {
// 删除商品 // 删除商品
this.form.promotionGoodsList.splice(index, 1); this.form.promotionGoodsList.splice(index, 1);
}, },
selectedGoodsData(item) { selectedGoodsData (item) {
// 回显已选商品 // 回显已选商品
let list = []; let list = [];
item.forEach((e) => { item.forEach((e) => {
@ -532,7 +384,7 @@ export default {
}); });
this.form.promotionGoodsList = list; this.form.promotionGoodsList = list;
}, },
getCouponList(query) { getCouponList (query) {
// 优惠券列表 // 优惠券列表
let params = { let params = {
pageSize: 10, pageSize: 10,
@ -549,7 +401,7 @@ export default {
} }
}); });
}, },
getGiftList(query) { getGiftList (query) {
// 赠品列表 // 赠品列表
let params = { let params = {
pageSize: 10, pageSize: 10,
@ -583,11 +435,13 @@ h4 {
line-height: 40px; line-height: 40px;
text-align: left; text-align: left;
} }
.describe { .describe {
font-size: 12px; font-size: 12px;
margin-left: 10px; margin-left: 10px;
color: #999; color: #999;
} }
.ivu-form-item { .ivu-form-item {
margin-bottom: 24px !important; margin-bottom: 24px !important;
} }

61
seller/src/views/promotion/seckill/seckill.vue
View File

@ -14,20 +14,14 @@
</Select> </Select>
</Form-item> </Form-item>
<Form-item label="活动时间"> <Form-item label="活动时间">
<DatePicker v-model="selectDate" type="daterange" clearable placeholder="选择起始时间" style="width: 200px"></DatePicker> <DatePicker v-model="selectDate" type="daterange" clearable placeholder="选择起始时间" style="width: 200px">
</DatePicker>
</Form-item> </Form-item>
<Button @click="handleSearch" type="primary" class="search-btn">搜索</Button> <Button @click="handleSearch" type="primary" class="search-btn">搜索</Button>
<Button @click="handleReset" class="ml_10">重置</Button> <Button @click="handleReset" class="ml_10">重置</Button>
</Form> </Form>
<Table <Table :loading="loading" border :columns="columns" :data="data" ref="table" class="mt_10">
:loading="loading"
border
:columns="columns"
:data="data"
ref="table"
class="mt_10"
>
<template slot-scope="{ row }" slot="applyEndTime"> <template slot-scope="{ row }" slot="applyEndTime">
{{ unixDate(row.applyEndTime) }} {{ unixDate(row.applyEndTime) }}
</template> </template>
@ -37,25 +31,14 @@
}}</Tag> }}</Tag>
</template> </template>
<template slot-scope="{ row }" slot="action"> <template slot-scope="{ row }" slot="action">
<Button <Button v-if="row.promotionStatus === 'NEW'" type="primary" size="small" @click="manage(row)">管理</Button>
v-if="row.promotionStatus === 'NEW'" <Button v-else type="info" size="small" @click="manage(row)">查看</Button>
type="primary"
size="small"
@click="manage(row)"
>管理</Button
>
<Button
v-else
type="info"
size="small"
@click="manage(row)"
>查看</Button
>
</template> </template>
</Table> </Table>
<Row type="flex" justify="end" class="mt_10"> <Row type="flex" justify="end" class="mt_10">
<Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage"
size="small" show-total show-elevator show-sizer></Page> @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" size="small" show-total show-elevator
show-sizer></Page>
</Row> </Row>
</Card> </Card>
</div> </div>
@ -66,9 +49,9 @@ import { seckillList } from "@/api/promotion";
export default { export default {
name: "seckill", name: "seckill",
components: {}, components: {},
data() { data () {
return { return {
selectDate:[], selectDate: [],
loading: true, // 表单加载状态 loading: true, // 表单加载状态
searchForm: { searchForm: {
// 搜索框初始化对象 // 搜索框初始化对象
@ -141,27 +124,27 @@ export default {
}, },
methods: { methods: {
// 初始化数据 // 初始化数据
init() { init () {
this.getDataList(); this.getDataList();
}, },
// 分页 改变页码 // 分页 改变页码
changePage(v) { changePage (v) {
this.searchForm.pageNumber = v; this.searchForm.pageNumber = v;
this.getDataList(); this.getDataList();
}, },
// 分页 改变页数 // 分页 改变页数
changePageSize(v) { changePageSize (v) {
this.searchForm.pageSize = v; this.searchForm.pageSize = v;
this.getDataList(); this.getDataList();
}, },
// 搜索 // 搜索
handleSearch() { handleSearch () {
this.searchForm.pageNumber = 1; this.searchForm.pageNumber = 1;
this.searchForm.pageSize = 10; this.searchForm.pageSize = 10;
this.getDataList(); this.getDataList();
}, },
// 重置 // 重置
handleReset() { handleReset () {
this.searchForm = {}; this.searchForm = {};
this.selectDate = ""; this.selectDate = "";
this.searchForm.pageNumber = 1; this.searchForm.pageNumber = 1;
@ -169,11 +152,11 @@ export default {
this.getDataList(); this.getDataList();
}, },
// 管理 // 管理
manage(row) { manage (row) {
this.$router.push({ name: "seckill-goods", query: { id: row.id } }); this.$router.push({ name: "seckill-goods", query: { id: row.id } });
}, },
// 获取列表数据 // 获取列表数据
getDataList() { getDataList () {
this.loading = true; this.loading = true;
if (this.selectDate && this.selectDate[0] && this.selectDate[1]) { if (this.selectDate && this.selectDate[0] && this.selectDate[1]) {
this.searchForm.startTime = this.selectDate[0].getTime(); this.searchForm.startTime = this.selectDate[0].getTime();
@ -191,11 +174,11 @@ export default {
} }
}); });
}, },
unixDate(time) { unixDate (time) {
// 处理报名截止时间 // 处理报名截止时间
return this.$options.filters.unixToDate(new Date(time) / 1000); return this.$options.filters.unixToDate(new Date(time) / 1000);
}, },
unixHours(item) { unixHours (item) {
// 处理小时场次 // 处理小时场次
let hourArr = item.split(","); let hourArr = item.split(",");
for (let i = 0; i < hourArr.length; i++) { for (let i = 0; i < hourArr.length; i++) {
@ -204,16 +187,16 @@ export default {
return hourArr; return hourArr;
}, },
}, },
mounted() { mounted () {
this.init(); this.init();
}, },
// 页面缓存处理，从该页面离开时，修改KeepAlive为false，保证进入该页面是刷新 // 页面缓存处理，从该页面离开时，修改KeepAlive为false，保证进入该页面是刷新
beforeRouteLeave(to, from, next) { beforeRouteLeave (to, from, next) {
from.meta.keepAlive = false from.meta.keepAlive = false
next() next()
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/styles/table-common.scss";
</style> </style>