H5_module/template/bargain/bargain.vue

<template>
<view>
<!--components/bargain/bargain.wxml-->
<!-- 砍价 -->
<template name="bargain">
	<view class="pdlr20">
		<view class="mt20  bgfff r10 " v-if="bargainList && bargainList.products.length > 0">
			<navigator hover-class="none" :url="'/activity/bargain/index/index' + url" class="head">
				<view class="titleNav pdlr20 dflex" v-if="bargainTemplate.titleType==1">
					{{bargainTemplate.titleCon}}
					<image src="/static/pages/images/more.png" class="more"></image>
				</view>
				<image lazy-load="true" v-if="bargainTemplate.titleType==2" :src="bargainTemplate.titleCon + '?x-oss-process=style/w750-auto'" mode="widthFix" class="imgtit"></image>
			</navigator>
			<goodsList :pageList="bargainList" :about="about" :merchant="web" :type="'5'" :typeName="'砍价'"></goodsList>
<!-- 			<view class="pintuan pdlr20">
				<block v-for="(item, index) in bargainList" :key="index">
					<view class="li dflex">
						<image :src="item.pic" mode="aspectFit" class="proimg" @tap="goUrl" :data-url="'activity/bargain/detail/detail?id=' + item.productId + '&acid=' + item.id + '' + web">
						</image>
						<view class="kjcon flex">
							<view class="name" @tap="goUrl" :data-url="'activity/bargain/detail/detail?id=' + item.productId + '&acid=' + item.id + '' + web">
								{{item.productName}}
							</view>
							<view class="kan-price dflex" @tap="goUrl" :data-url="'activity/bargain/detail/detail?id=' + item.productId + '&acid=' + item.id + '' + web">
								<text class="tag mbglinear">砍价后</text>
								<view class="price"><text>￥</text>{{item.money}}</view>
								<text class="del" v-if="item.orPrice!=0&&item.orPrice>item.money">原价：￥{{item.orPrice}}</text>
							</view>
							<view class="kan-times dflex">
								<view class="kan-time" v-if="item.end==true&&item.start==true">已结束</view>
								<view class="kan-time dflex" v-else>
									<block v-if="item.times.length==4">
										<block v-if="item.times[0] !=0"><text>{{item.times[0]}}</text>天</block>
										<text>{{item.times[1]}}</text>:
										<text>{{item.times[2]}}</text>:
										<text>{{item.times[3]}}</text>
									</block>
									<block v-else>
										<text>{{item.times[0]}}</text>:
										<text>{{item.times[1]}}</text>:
										<text>{{item.times[2]}}</text>
									</block>
									<view>{{item.start==false?'后开始':'后结束'}}</view>
								</view>
								<view class="kan-btn mbglinear" v-if="item.end==false&&item.start==true" @tap="goUrl" :data-url="'activity/bargain/detail/detail?id=' + item.productId + '&acid=' + item.id + '' + web">
									立即砍价</view>
								<block v-else>
									<view class="remind mbggreen dflex" v-if="item.start==false&&item.isRemind" @tap="cancelActivityRemind" :data-index="index" data-type="4" :data-id="item.id">取消预约
									</view>
									<view class="remind mbggreen dflex" v-if="item.start==false&&!item.isRemind" @tap="addActivityRemind" :data-index="index" data-type="4" :data-id="item.id">
										<icon class="iconfont icon-yugao"></icon>预约提醒
									</view>
								</block>
							</view>
						</view>
					</view>
				</block>
			</view> -->
		</view>
	</view>

</template>
</view>
</template>

<script>
// components/bargain/bargain.js
const route = require("../../utils/route.js");
const utils = require("../../utils/util.js");
const mes = require("../../utils/requestmessage.js");
const req = require("../../utils/request.js");
const app = getApp();
import goodsList from "../../components/goodsList/goodsList";
export default {
  data() {
    return {
    };
  },

  components: {goodsList},
  props: {
	bargainTemplate:Object,  //砍价后台模板配置
	bargainList:Object,		//{backgroundColor:背景颜色,displayStyle: 样式模板,lineNumber:每行几个,products:产品列表}
	url:String,  //跳转地址
	web:String,  //跳转地址
	about:Object //参数配置
  },
  watch: {

  },
  methods: {
    getRqeDatas() {
      let that = this; //砍价

      let bargain = that.homeTemplate.filter(it => it.module == that.templateType.module_bargain);

      if (bargain && bargain.length > 0 && bargain[0].state == 0) {
        that.setData({
          bargainTemplate: bargain[0]
        });
        this.bargainListFun(bargain[0]);
      }
    },

    //砍价
    bargainListFun(bargainTemplate) {
      let _ts = this;

      _ts.clearAllTimer(3);

      if (this.merchant && this.merchant.type == 5 || this.shopId && this.merchantId) {
        let from = {
          page: this.page,
          limit: bargainTemplate.number,
          type: 7,
          merchantId: this.merchant.merchantDTO.id,
          sid: this.merchant.id
        };
        if (this.shopId && this.merchantId) from.merchantId = this.merchantId, from.sid = this.shopId;
        route.getShopeList(from, res => {
          res = res.list.map(it => {
            it.isRemind = it.remindId;
            return it;
          });
          let arrObjFilter = res.filter(ele => ele.end == false);
          this.setData({
            bargainList: arrObjFilter
          });

          _ts.initGroupTimer(3);
        });
      }

      if (this.merchant && this.merchant.type != 5) {
        route.getAcitveNew({
          page: 1,
          limit: bargainTemplate.number,
          type: 5,
          tag: 'home'
        }, data => {
          data = data.list.map(it => {
            it.isRemind = it.remindId;
            return it;
          });
          let arrObjFilter = data.filter(ele => ele.end == false);

          _ts.setData({
            bargainList: arrObjFilter
          });

          _ts.initGroupTimer(3);
        });
      }
    },

    //1为社区团购，2为拼团,3为砍价
    initGroupTimer(type) {
      //社区拼图定时器
      let _ts = this;

      let list = [];
      if (type == 3) list = this.bargainList;

      if (list && list.length > 0) {
        // let activityGroup = this.data.activityGroup;
        for (let i = 0, len = list.length; i < len; i++) {
          let group = list[i];
          let nowTime = new Date(group.nowTime.replace(/-/g, '/')).getTime();
          let startTime = new Date(group.startTime.replace(/-/g, '/')).getTime();
          let endTime = new Date(group.endTime.replace(/-/g, '/')).getTime();
          if (!group.start) endTime = startTime;
          let times = parseInt((endTime - nowTime) / 1000);
          let timer = setInterval(() => {
            times--;
            let data = {};

            if (times === 0) {
              //重新加载列表
              if (type == 3) data['bargainList[' + i + '].end'] = true;
              clearInterval(timer);
            } else {
              let n = utils.formatDayTimes(times);
              if (type == 3) data['bargainList[' + i + '].times'] = n.split(/:|天/g);
            }

            _ts.setData(data);
          }, 1000);
          if (type == 3) this.bargainList[i]['timer'] = timer; // let fs = [];
          // fs['activityGroup[' + i + '].timer'] = timer;
          // _ts.setData(fs);
        }
      }
    },

    clearAllTimer(type) {
      // console.log(this.activityGroup, this.joingroupList, this.bargainList, this.customersList);
      if (type == 3) this.bargainList.forEach(it => clearInterval(it.timer));
    },

    cancelActivityRemind(event) {
      const index = event.currentTarget.dataset.index;
      const id = event.currentTarget.dataset.id;
      const type = event.currentTarget.dataset.type;
	  if(req.header.appId=='ZQ1VK5oc17I387E'){
	  		  
	  }else{
		route.cancelActivityRemind({
		  id: id
		}, res => {
		  req.msg('取消提醒成功');
		  let data = {};
		  if (type == 4) data['bargainList[' + index + '].isRemind'] = false;
		  this.setData(data);
		});  
	  }
    },

    addActivityRemind(event) {
      const index = event.currentTarget.dataset.index;
      const id = event.currentTarget.dataset.id;
      const type = event.currentTarget.dataset.type;
      
      route.addActivityRemind({
        activityId: id
      }, res => {
		  mes.remind().then(res => res);
        // mes.remind().then(res=>res)
        // mes.requsetmessage()
        req.msg('订阅提醒成功');
        let data = {};
        if (type == 4) data['bargainList[' + index + '].isRemind'] = true;
        this.setData(data);
      });
    },

    goUrl(event) {
      //跳转链接
      let url = event.currentTarget.dataset.url;
      app.globalData.openPage(url);
    }

  }
};
</script>
<style>
@import "./bargain.css";
</style>