commit
8c118b4ec5
731 changed files with 161325 additions and 0 deletions
@ -0,0 +1,47 @@ |
|||
# ---> Node |
|||
# Logs |
|||
logs |
|||
*.log |
|||
npm-debug.log* |
|||
|
|||
# Runtime data |
|||
pids |
|||
*.pid |
|||
*.seed |
|||
|
|||
# Directory for instrumented libs generated by jscoverage/JSCover |
|||
lib-cov |
|||
|
|||
# Coverage directory used by tools like istanbul |
|||
coverage |
|||
|
|||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) |
|||
.grunt |
|||
|
|||
# node-waf configuration |
|||
.lock-wscript |
|||
|
|||
# Compiled binary addons (http://nodejs.org/api/addons.html) |
|||
build/Release |
|||
|
|||
# Dependency directory |
|||
# https://docs.npmjs.com/misc/faq#should-i-check-my-node-modules-folder-into-git |
|||
#node_modules |
|||
dist |
|||
|
|||
.idea |
|||
.vscode |
|||
.buildpath |
|||
.project |
|||
.settings |
|||
.DS_Store |
|||
.hbuilderx |
|||
*.suo |
|||
*.ntvs* |
|||
*.njsproj |
|||
*.sln |
|||
*.sw? |
|||
Thumbs.db |
|||
yarn.lock |
|||
#package-lock.json |
|||
src/unpackage |
|||
File diff suppressed because it is too large
@ -0,0 +1,18 @@ |
|||
# zhiwei-front |
|||
|
|||
知味日记-前端 |
|||
|
|||
## 接口域名 |
|||
|
|||
- https://zhiwei.kingfarming.cn/ 生产环境 |
|||
- https://dev.lansoft.shop 开发环境 |
|||
|
|||
## 小程序 |
|||
|
|||
- 知味日志AppID(小程序ID) wx3c09cbc4619152de |
|||
|
|||
## 多商城配置 |
|||
|
|||
修改`siteinfo.js`里面的uniacid为对应的商城ID |
|||
|
|||
- 知味日志 1 |
|||
@ -0,0 +1,732 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul + '/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}} <text v-if="address.company">{{address.company}}</text></view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul + '/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
<view class="buydata"> |
|||
<view class="btitle"><image class="img" :src="event_rul + '/static/img/static/img/ico-shop.png'"/>{{business.name}}</view> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex"> |
|||
<view class="img"> |
|||
<image class="img" v-if="guige.pic" :src="guige.pic"></image> |
|||
<image class="img" v-else :src="product.pic"></image> |
|||
</view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2">规格:{{guige.name}}</view> |
|||
<view class="f3">¥{{guige.sell_price}}<text v-if="buytype!=1" class="collage_icon">拼团价</text> × {{totalnum}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice*1 > product_price*1">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">商品金额</text> |
|||
<text class="f2">¥{{product_price}}</text> |
|||
</view> |
|||
<view class="price" v-if="leadermoney*1>0"> |
|||
<text class="f1">团长优惠</text> |
|||
<text class="f2">-¥{{leadermoney}}</text> |
|||
</view> |
|||
<view class="price" v-if="leveldk_money*1>0"> |
|||
<text class="f1">{{t('会员')}}折扣({{userinfo.discount}}折)</text> |
|||
<text class="f2">-¥{{leveldk_money}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freight_price}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<view class="f1">{{t('优惠券')}}</view> |
|||
<view v-if="couponList.length>0" class="f2" @tap="showCouponList"><text style="color:#fff;padding:4rpx 16rpx;font-weight:normal;border-radius:8rpx;font-size:24rpx" :style="{background:t('color1')}">{{couponrid!=0?couponList[couponkey].couponname:couponList.length+'张可用'}}</text><text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
<text class="f2" v-else style="color:#999">无可用{{t('优惠券')}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="scoredk flex" v-if="userinfo.score2money > 0"> |
|||
<checkbox-group @change="scoredk" class="flex" style="width:100%"> |
|||
<view class="f1"> |
|||
<view>{{userinfo.score*1}} {{t('积分')}}可抵扣 <text style="color:#e94745">{{userinfo.scoredk_money*1}}</text> 元</view> |
|||
<view style="font-size:22rpx;color:#999" v-if="userinfo.scoredkmaxpercent > 0 && userinfo.scoredkmaxpercent<100">最多可抵扣订单金额的{{userinfo.scoredkmaxpercent}}%</view> |
|||
</view> |
|||
<view class="f2">使用{{t('积分')}}抵扣 |
|||
<checkbox value="1" style="margin-left:6px;transform:scale(.8)"></checkbox> |
|||
</view> |
|||
</checkbox-group> |
|||
</view> |
|||
<view style="width: 100%;height:110rpx"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="text1 flex1">总计: |
|||
<text style="font-weight:bold;font-size:36rpx">¥{{totalprice}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="couponvisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{t('优惠券')}}</text> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="handleClickMask"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<couponlist :couponlist="couponList" :choosecoupon="true" :selectedrid="couponrid" :bid="product.bid" @chooseCoupon="chooseCoupon"></couponlist> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
business:{}, |
|||
productList: [], |
|||
freightList: [], |
|||
couponList: [], |
|||
couponrid: 0, |
|||
coupontype: 1, |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
usescore: 0, |
|||
totalprice: '0.00', |
|||
product_price: 0, |
|||
leveldk_money: 0, |
|||
scoredk_money: 0, |
|||
coupon_money: 0, |
|||
storedata: [], |
|||
storeid: '', |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
isload: 0, |
|||
leadermoney: 0, |
|||
couponvisible: false, |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
product: "", |
|||
guige: "", |
|||
userinfo: "", |
|||
buytype: "", |
|||
scorebdkyf: "", |
|||
totalnum: "", |
|||
havetongcheng: "", |
|||
weight: "", |
|||
goodsnum: "", |
|||
beizhu: "", |
|||
couponkey: 0, |
|||
storeshowall:false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiCollage/buy', {proid: that.opt.proid,ggid: that.opt.ggid,num: that.opt.num,buytype: that.opt.buytype}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg, function(){ |
|||
app.goback() |
|||
}); |
|||
return; |
|||
} |
|||
var product = res.product; |
|||
var freightList = res.freightList; |
|||
var userinfo = res.userinfo; |
|||
var couponList = res.couponList; |
|||
that.product = product; |
|||
that.guige = res.guige; |
|||
that.business = res.business; |
|||
that.freightList = freightList; |
|||
that.userinfo = userinfo; |
|||
that.couponList = couponList; |
|||
that.buytype = res.buytype; |
|||
that.address = res.address; |
|||
that.scorebdkyf = res.scorebdkyf; |
|||
that.totalnum = res.totalnum; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
var leadermoney = 0; //商品总价 重量 |
|||
|
|||
var product_price = res.product_price; |
|||
|
|||
if (res.buytype == 2 && product.leadermoney * 1 > 0) { |
|||
leadermoney = product.leadermoney * 1; |
|||
} |
|||
leadermoney = leadermoney.toFixed(2); //会员折扣 |
|||
var leveldk_money = 0; |
|||
if (userinfo.discount > 0 && userinfo.discount < 10) { |
|||
leveldk_money = (product_price - leadermoney) * (1 - userinfo.discount * 0.1); |
|||
leveldk_money = leveldk_money.toFixed(2); |
|||
} |
|||
that.product_price = res.product_price; |
|||
that.leadermoney = leadermoney; |
|||
that.leveldk_money = leveldk_money; |
|||
that.scoredk_money = userinfo.scoredk_money; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
|
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
for (var j in freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude) { |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var product_price = parseFloat(that.product_price); //+商品总价 |
|||
var leadermoney = parseFloat(that.leadermoney); //-团长优惠 |
|||
var leveldk_money = parseFloat(that.leveldk_money); //-会员折扣 |
|||
var coupon_money = parseFloat(that.coupon_money); //-优惠券抵扣 |
|||
var address = that.address; //算运费 |
|||
var freightdata = that.freightList[that.freightkey]; |
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress; |
|||
var freight_price = freightdata.freight_price; |
|||
if (that.coupontype == 4) { |
|||
freight_price = 0; |
|||
coupon_money = 0; |
|||
} |
|||
var totalprice = product_price - leadermoney - leveldk_money - coupon_money; |
|||
if (totalprice < 0) totalprice = 0; //优惠券不抵扣运费 |
|||
|
|||
var oldtotalprice = totalprice; |
|||
if (that.usescore) { |
|||
var scoredk_money = parseFloat(that.scoredk_money); //-积分抵扣 |
|||
} else { |
|||
var scoredk_money = 0; |
|||
} |
|||
totalprice = totalprice + freight_price - scoredk_money; |
|||
if (that.scorebdkyf == '1' && scoredk_money > 0 && totalprice < freight_price) { |
|||
//积分不抵扣运费 |
|||
totalprice = freight_price; |
|||
scoredk_money = oldtotalprice - freight_price; |
|||
} |
|||
var scoredkmaxpercent = parseFloat(that.userinfo.scoredkmaxpercent); //最大抵扣比例 |
|||
|
|||
if (scoredk_money > 0 && scoredkmaxpercent > 0 && scoredkmaxpercent < 100 && scoredk_money > oldtotalprice * scoredkmaxpercent * 0.01) { |
|||
scoredk_money = oldtotalprice * scoredkmaxpercent * 0.01; |
|||
totalprice = oldtotalprice - scoredk_money; |
|||
} |
|||
if (totalprice < 0) totalprice = 0; |
|||
freight_price = freight_price.toFixed(2); |
|||
totalprice = totalprice.toFixed(2); |
|||
that.totalprice = totalprice |
|||
that.freight_price = freight_price; |
|||
}, |
|||
//积分抵扣 |
|||
scoredk: function (e) { |
|||
var usescore = e.detail.value[0]; |
|||
if (!usescore) usescore = 0; |
|||
this.usescore = usescore; |
|||
this.calculatePrice(); |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
chooseCoupon: function (e) { |
|||
var couponrid = e.rid; |
|||
var couponkey = e.key; |
|||
|
|||
if (couponrid == this.couponrid) { |
|||
this.couponkey = 0; |
|||
this.couponrid = 0; |
|||
this.coupontype = 1; |
|||
this.coupon_money = 0; |
|||
this.couponvisible = false; |
|||
} else { |
|||
var couponList = this.couponList; |
|||
var coupon_money = couponList[couponkey]['money']; |
|||
var coupontype = couponList[couponkey]['type']; |
|||
if (coupontype == 4) { |
|||
coupon_money = this.freightprice; |
|||
} |
|||
this.couponkey = couponkey; |
|||
this.couponrid = couponrid; |
|||
this.coupontype = coupontype; |
|||
this.coupon_money = coupon_money; |
|||
this.couponvisible = false; |
|||
} |
|||
this.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var buytype = this.buytype; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var prodata = this.opt.prodata; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
var usescore = this.usescore; |
|||
var couponkey = this.couponkey; |
|||
var couponrid = this.couponrid; |
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var freight_time = that.freight_time; |
|||
|
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
|
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
|
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/createOrder', { |
|||
proid: that.opt.proid, |
|||
ggid: that.opt.ggid, |
|||
num: that.opt.num, |
|||
buytype: buytype, |
|||
teamid: that.opt.teamid, |
|||
storeid: storeid, |
|||
couponrid: couponrid, |
|||
freightid: freightid, |
|||
freight_time: freight_time, |
|||
addressid: addressid, |
|||
usescore: usescore, |
|||
linkman: linkman, |
|||
tel: tel, |
|||
formdata: newformdata |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.error(data.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + data.payorderid); |
|||
}); |
|||
}, |
|||
showCouponList: function () { |
|||
this.couponvisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.couponvisible = false; |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
console.log(storeinfo) |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:10rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .text1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .text1 text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
|
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,200 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form-content"> |
|||
<view class="form-item1"> |
|||
<view class="label">商品信息</view> |
|||
<view class="product flex"> |
|||
<view class="img"><image :src="og.propic"></image></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{og.proname}}</view> |
|||
<view class="f2">{{og.ggname}}</view> |
|||
<view class="f3">¥{{og.sell_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item2 flex flex-y-center"> |
|||
<view class="label">您的打分</view> |
|||
<view class="i-rate" @touchmove="handleTouchMove"> |
|||
<input type="text" name="score" :value="score" class="i-rate-hide-input"></input> |
|||
<view v-for="(item, index) in 5" :key="index" class="i-rate-star" :class="( index < score ? 'i-rate-current':'' )" :data-index="index" @tap="handleClick"> |
|||
<image v-if="index < score" :src="event_rul + '/static/img/static/img/star2.png'"></image> |
|||
<image v-else :src="event_rul + '/static/img/static/img/star.png'"></image> |
|||
</view> |
|||
<view class="i-rate-text"></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item3 flex-col"> |
|||
<view class="label">您的评价</view> |
|||
<textarea placeholder="输入您的评价内容" placeholder-style="color:#ccc;" name="content" :value="comment.content" style="height:200rpx" :disabled="comment.id?true:false"></textarea> |
|||
</view> |
|||
|
|||
<view class="form-item4 flex-col"> |
|||
<view class="label">上传图片</view> |
|||
<view id="content_picpreview" class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view v-for="(item, index) in content_pic" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="content_pic" v-if="!comment.id"><image :src="event_rul + '/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" bindtap="xuanzhuan" data-index="{{index}}" data-field="content_pic" wx:if="{{!comment.id}}"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="content_pic" v-if="!comment.id && content_pic.length<5"></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<button class="btn" form-type="submit" :style="{background:t('color1')}" v-if="!comment.id">确定</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
og:{}, |
|||
comment:{}, |
|||
score: 0, |
|||
content_pic: [], |
|||
tempFilePaths: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
that.loading = true; |
|||
app.get('ApiCollage/comment', {orderid: orderid}, function (res) { |
|||
that.loading = false; |
|||
that.og = res.og; |
|||
if (res.comment){ |
|||
that.comment = res.comment; |
|||
that.score = res.comment.score; |
|||
var content_pic = res.comment.content_pic; |
|||
that.content_pic = content_pic.split(','); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
var score = e.detail.value.score; |
|||
var content = e.detail.value.content; |
|||
var content_pic = that.content_pic; |
|||
if (score == 0) { |
|||
app.error('请打分'); |
|||
return; |
|||
} |
|||
if (content == '') { |
|||
app.error('请填写评价内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/comment', {orderid: orderid,content: content,content_pic: content_pic.join(','),score: score}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 2000); |
|||
}); |
|||
}, |
|||
handleClick: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.score = index + 1; |
|||
}, |
|||
handleTouchMove: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var clientWidth = uni.getSystemInfoSync().windowWidth; |
|||
if (!e.changedTouches[0]) return; |
|||
var movePageX = e.changedTouches[0].pageX; |
|||
var space = movePageX - 150 / 750 * clientWidth; |
|||
if (space <= 0) return; |
|||
var starwidth = 60 / 750 * clientWidth; |
|||
var setIndex = Math.ceil(space / starwidth); |
|||
setIndex = setIndex > 5 ? 5 : setIndex; |
|||
this.score = setIndex; |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
},1) |
|||
}, |
|||
removeimg:function(e){ |
|||
var that = this; |
|||
var index= e.currentTarget.dataset.index |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
pics.splice(index,1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-content{width:94%;margin:10rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;background:#fff;overflow:hidden} |
|||
.form-item1{ width:100%;background: #fff; padding: 8rpx 20rpx;} |
|||
.form-item1 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.product{ width: 100%; background: #fff; } |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f2{color: #a4a4a4; font-size:24rpx} |
|||
.product .info .f3{color: #ff0d51; font-size:28rpx} |
|||
.product image{ width:140rpx;height:140rpx} |
|||
|
|||
.form-item2{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item2 .label{ width:150rpx;height:60rpx;line-height:60rpx} |
|||
|
|||
.form-item3{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item3 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item3 textarea{width: 100%;border: 1px #dedede solid; border-radius: 10rpx; padding: 10rpx;height: 120rpx;} |
|||
|
|||
|
|||
.form-item4{width:100%;background: #fff; padding: 20rpx 20rpx;margin-top:1px} |
|||
.form-item4 .label{ width:150rpx;} |
|||
/*.form-item4 image{ width: 100rpx; height: 100rpx;background:#eee;margin-right:6rpx} |
|||
.form-item4 .imgbox{height:100rpx}*/ |
|||
|
|||
|
|||
.btn{ height:100rpx;line-height: 100rpx;width:90%;margin:0 auto;border-radius:50rpx;margin-top:50rpx;color: #fff;font-size: 30rpx;font-weight:bold} |
|||
|
|||
.i-rate{margin:0;padding:0;display:inline-block;vertical-align:middle;} |
|||
.i-rate-hide-input{display:none} |
|||
.i-rate-star{display:inline-block;color:#e9e9e9;padding:0 10rpx} |
|||
.i-rate-star image{width:50rpx;height:50rpx} |
|||
.i-rate-current{color:#f5a623} |
|||
.i-rate-text{display:inline-block;vertical-align:middle;margin-left:6px;font-size:14px} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="comment"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="item.headimg"/> |
|||
<view class="t2">{{item.nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (item.score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view style="color:#777;font-size:22rpx;">{{item.createtime}}</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="item.content_pic!=''"> |
|||
<block v-for="(itemp, index) in item.content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="item.content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
<text class="t3">规格:{{item.ggname}}</text> |
|||
</view> |
|||
<view class="f3" v-if="item.reply_content"> |
|||
<view class="arrow"></view> |
|||
<view class="t1">商家回复:{{item.reply_content}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata" text="暂无评价~"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
event_rul: app.globalData.event_url |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiCollage/commentlist', {proid: that.opt.proid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{background:#fff} |
|||
.comment{display:flex;flex-direction:column;padding:10rpx 0;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{width:100%;padding:10rpx 0;position:relative} |
|||
.comment .item .f3 .arrow{width: 16rpx;height: 16rpx;background:#eee;transform: rotate(45deg);position:absolute;top:0rpx;left:36rpx} |
|||
.comment .item .f3 .t1{width:100%;border-radius:10rpx;padding:10rpx;font-size:22rpx;color:#888;background:#eee} |
|||
|
|||
</style> |
|||
@ -0,0 +1,168 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<swiper v-if="pics.length>0" class="swiper" :indicator-dots="pics[1]?true:false" autoplay="true" :interval="5000"> |
|||
<block v-for="(item, index) in pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<image :src="item" mode="widthFix"></image> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<scroll-view class="category" scroll-x="true" v-if="clist.length>0"> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<view class="item" @tap="changetab" :data-st="item.id"> |
|||
<image :src="item.pic"></image> |
|||
<text class="t1">{{item.name}}</text> |
|||
</view> |
|||
</block> |
|||
<view class="item" @tap="changetab" data-st> |
|||
<image :src="event_rul + '/static/img/static/img/all.png'" style="border-radius:0"></image> |
|||
<text class="t1">全部</text> |
|||
</view> |
|||
</scroll-view> |
|||
<view class="datalist"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view :data-url="'product?id=' + item.id" @tap="goto" class="collage-product"> |
|||
<view class="product-pic"> |
|||
<image :src="item.pic" mode="widthFix"></image> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="p1">{{item.name}}</view> |
|||
<view class="p2"> |
|||
<view class="p2-1"> |
|||
<text class="t1" :style="{color:t('color1')}"><text style="font-size:24rpx">¥</text>{{item.sell_price}}</text> |
|||
<text class="t2" v-if="item.market_price*1 > item.sell_price*1">¥{{item.market_price}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="p3"> |
|||
<view class="t1">已拼成<text style="font-size:32rpx;color:#f40;padding:0 2rpx;">{{item.sales}}</text>件</view> |
|||
<view class="t2" :style="{borderColor:t('color1'),color:t('color1')}"> |
|||
<text class="x1">{{item.teamnum}}人团</text> |
|||
<text class="x2" :style="{backgroundColor:t('color1')}">去拼团</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<button class="covermy" @tap="goto" data-url="orderlist">我的拼团</button> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
bid:'', |
|||
pics: [], |
|||
pagenum: 1, |
|||
st: '', |
|||
datalist: [], |
|||
nomore: false, |
|||
nodata:false, |
|||
event_rul: app.globalData.event_url |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.bid = this.opt.bid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
var that = this; |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiCollage/index', {bid:that.bid,st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.pics = res.pics; |
|||
that.clist = res.clist; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
changetab: function (e) { |
|||
var st = e.currentTarget.dataset.st; |
|||
this.pagenum = 1; |
|||
this.st = st; |
|||
this.datalist = []; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.container{background:#f4f4f4} |
|||
.swiper {width:94%;margin:0 3%;height: 350rpx;margin-top: 20rpx;border-radius:20rpx;overflow:hidden} |
|||
.swiper image {width: 100%;height: 350rpx;overflow: hidden;} |
|||
|
|||
.category{width:94%;margin:0 3%;padding-top: 10px;padding-bottom: 10px;flex-direction:row;white-space: nowrap; display:flex;} |
|||
.category .item{width: 150rpx;display: inline-block; text-align: center;} |
|||
.category .item image{width: 80rpx;height: 80rpx;margin: 0 auto;border-radius: 50%;} |
|||
.category .item .t1{display: block;color: #666;} |
|||
|
|||
.datalist{width:94%;margin:0 3%;} |
|||
.collage-product {display:flex;height:220rpx; background: #fff; padding:20rpx 20rpx;margin-top: 20rpx;border-radius:20rpx} |
|||
.collage-product .product-pic {width: 180rpx;height: 180rpx; background: #ffffff;overflow:hidden} |
|||
.collage-product .product-pic image{width: 100%;height:180rpx;} |
|||
.collage-product .product-info {padding: 5rpx 10rpx;flex:1} |
|||
.collage-product .product-info .p1 {color:#323232;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:72rpx} |
|||
.collage-product .product-info .p2{font-size: 32rpx;height:40rpx;line-height: 40rpx} |
|||
.collage-product .product-info .p2 .t1{color: #f40;} |
|||
.collage-product .product-info .p2 .t2 {margin-left: 10rpx;font-size: 26rpx;color: #888;text-decoration: line-through;} |
|||
.collage-product .product-info .p3{font-size: 24rpx;height:50rpx;line-height:50rpx;overflow:hidden;display:flex;} |
|||
.collage-product .product-info .p3 .t1{color:#aaa;font-size:24rpx;flex:1} |
|||
.collage-product .product-info .p3 .t2{height: 50rpx;line-height: 50rpx;overflow: hidden;border: 1px #FF3143 solid;border-radius:10rpx;} |
|||
.collage-product .product-info .p3 .t2 .x1{padding: 10rpx 24rpx;} |
|||
.collage-product .product-info .p3 .t2 .x2{padding: 14rpx 24rpx;background: #FF3143;color:#fff;} |
|||
|
|||
.covermy{position:absolute;z-index:99999;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;z-index:9999;top:260rpx;right:0;color:#fff;background-color:rgba(17,17,17,0.3);width:140rpx;height:60rpx;font-size:26rpx;border-radius:30rpx 0px 0px 30rpx;} |
|||
</style> |
|||
@ -0,0 +1,341 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择货到付款' : '已成功付款'}}</view> |
|||
|
|||
<block v-if="detail.buytype!=1"> |
|||
<view class="t2" v-if="team.status==1">拼团中</view> |
|||
<view class="t2" v-if="team.status==2 && detail.freight_type!=1">拼团成功,我们会尽快为您发货</view> |
|||
<view class="t2" v-if="team.status==2 && detail.freight_type==1">拼团成功,请尽快前往自提地点取货</view> |
|||
<view class="t2" v-if="team.status==3">拼团失败,已退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</block> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" user-select="true" selectable="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul + '/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true" selectable="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1" user-select="true" selectable="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true" selectable="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="product"> |
|||
<view class="content"> |
|||
<view @tap="goto" :data-url="'product?id=' + detail.proid"> |
|||
<image :src="detail.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{detail.proname}}</text> |
|||
<text class="t2">{{detail.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{detail.sell_price}}</text><text class="x2">×{{detail.num}}</text></view> |
|||
</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==0 && shopset.comment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">去评价</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">查看评价</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true" selectable="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{detail.product_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.leveldk_money > 0"> |
|||
<text class="t1">{{t('会员')}}折扣</text> |
|||
<text class="t2 red">-¥{{detail.leveldk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.coupon_money > 0"> |
|||
<text class="t1">{{t('优惠券')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.coupon_money}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.scoredk_money > 0"> |
|||
<text class="t1">{{t('积分')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.scoredk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<block v-if="detail.status==1"> |
|||
<block v-if="detail.buytype!=1"> |
|||
<text v-if="team.status==1" class="t2">拼团中</text> |
|||
<text v-if="team.status==2 && detail.freight_type!=1" class="t2">拼团成功,待发货</text> |
|||
<text v-if="team.status==2 && detail.freight_type==1" class="t2">拼团成功,待提货</text> |
|||
<text v-if="team.status==3" class="t2">拼团失败,已退款</text> |
|||
</block> |
|||
<block v-else> |
|||
<text v-if="detail.freight_type!=1" class="t2">待发货</text> |
|||
<text v-if="detail.freight_type==1" class="t2">待提货</text> |
|||
</block> |
|||
</block> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true" selectable="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot" v-if="detail.status!=3"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="detail.status==1"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
<block v-if="detail.status==2"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
<view class="btn1" @tap="orderCollect" :data-id="detail.id">确认收货</view> |
|||
</block> |
|||
<block v-if="([1,2,3]).includes(detail.status) && invoice && team.status==2"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=collage&orderid=' + detail.id">发票</view> |
|||
</block> |
|||
<block v-if="(detail.buytype==1 || team.status==2) && (detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3"> |
|||
<view class="btn2">已完成</view> |
|||
</block> |
|||
<block v-if="detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul + '/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
textset:{}, |
|||
detail:{}, |
|||
team:{}, |
|||
storeinfo:{}, |
|||
shopset:{}, |
|||
invoice:0, |
|||
event_rul: app.globalData.event_url, |
|||
} |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function (option) { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiCollage/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.detail = res.detail; |
|||
that.team = res.team; |
|||
that.storeinfo = res.storeinfo; |
|||
that.shopset = res.shopset; |
|||
that.textset = app.globalData.textset; |
|||
that.invoice = res.invoice; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiCollage/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;position:relative} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{height:80rpx;line-height:40rpx;color: #000;} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px; left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;background:#FB4343;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,235 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['全部','待付款','待发货','待收货','已完成','退款']" :itemst="['all','0','1','2','3','10']" :st="st" :isfixed="true" @changetab="changetab"></dd-tab> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap.stop="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<text class="flex1">订单号:{{item.ordernum}}</text> |
|||
<text v-if="item.status==0" class="st0">待付款</text> |
|||
<block v-if="item.status==1"> |
|||
<block v-if="item.buytype!=1"> |
|||
<text v-if="item.team && item.team.status==1" class="st1">拼团中</text> |
|||
<text v-if="item.team && item.team.status==2 && item.freight_type!=1" class="st1">拼团成功,待发货</text> |
|||
<text v-if="item.team && item.team.status==2 && item.freight_type==1" class="st1">拼团成功,待提货</text> |
|||
<text v-if="item.team && item.team.status==3" class="st4">拼团失败,已退款</text> |
|||
</block> |
|||
<block v-else> |
|||
<text v-if="item.freight_type!=1" class="st1">待发货</text> |
|||
<text v-if="item.freight_type==1" class="st1">待提货</text> |
|||
</block> |
|||
</block> |
|||
|
|||
<text v-if="item.status==2" class="st2">待收货</text> |
|||
<text v-if="item.status==3" class="st3">已完成</text> |
|||
<text v-if="item.status==4" class="st4">已关闭</text> |
|||
</view> |
|||
|
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item.proid"> |
|||
<image :src="item.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.proname}}</text> |
|||
<text class="t2">{{item.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{item.sell_price}}</text><text class="x2">×{{item.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="bottom"> |
|||
<text>共计{{item.num}}件商品 实付:¥{{item.totalprice}}</text> |
|||
<text v-if="item.refund_status==1" style="color:red"> 退款中¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==2" style="color:red"> 已退款¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==3" style="color:red"> 退款申请已驳回</text> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="([1,2,3]).includes(item.status) && item.invoice && item.team && item.team.status==2"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=collage&orderid=' + item.id">发票</view> |
|||
</block> |
|||
<view @tap.stop="goto" :data-url="'orderdetail?id=' + item.id" class="btn2">详情</view> |
|||
<view @tap.stop="goto" :data-url="'team?teamid=' + item.teamid" class="btn2" v-if="item.buytype!=1 && item.teamid">查看团</view> |
|||
<block v-if="item.status==0"> |
|||
<view class="btn2" @tap.stop="toclose" :data-id="item.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="goto" :data-url="'/pages/pay/pay?id=' + item.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="item.status==1"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-if="item.status==2"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
<view class="btn2" @tap.stop="goto" :data-url="'/pages/order/logistics?express_com=' + item.express_com + '&express_no=' + item.express_no" v-if="item.freight_type!=3 && item.freight_type!=4">查看物流</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="orderCollect" :data-id="item.id">确认收货</view> |
|||
</block> |
|||
<block v-if="item.status==4"> |
|||
<view class="btn2" @tap.stop="todel" :data-id="item.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiCollage/orderlist', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiCollage/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.order-tab{position:fixed;top:var(--window-top);z-index:11;display:flex;width:100%; height:90rpx;border-bottom: 1px #f4f4f4 solid;background: #fff; margin-bottom: 10rpx;} |
|||
.order-tab .item{flex:1;font-size:28rpx; text-align: center; color:#666; height: 90rpx; line-height: 90rpx; overflow: hidden;position:relative} |
|||
.order-tab .on{color: #323233;} |
|||
.order-tab .on:after{content:'';position:absolute;left:50%;margin-left:-40rpx;bottom:0;height:3px;border-radius:1.5px;background:#ff4a03;width:80rpx} |
|||
|
|||
.container{ width:100%;margin-top:90rpx} |
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
.order-box .head .st0{ width: 140rpx; color: #ff8758; text-align: right; } |
|||
.order-box .head .st1{ width: 204rpx; color: #ffc702; text-align: right; } |
|||
.order-box .head .st2{ width: 204rpx; color: #ff4246; text-align: right; } |
|||
.order-box .head .st3{ width: 140rpx; color: #999; text-align: right; } |
|||
.order-box .head .st4{ width: 140rpx; color: #bbb; text-align: right; } |
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;flex-wrap: wrap;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
/*.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px; font-size: 14px; position: absolute; bottom: 10px; right: 10px; background: #fff; }*/ |
|||
.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px;} |
|||
|
|||
.zan-tex{clear:both; display: block; width: 100%; color: #565656; font-size: 12px; height: 30px; line-height: 30px; text-align: center; } |
|||
.ind-bot{ width: 100%; float: left; text-align: center; height: 50px; line-height: 50px; font-size: 13px; color: #ccc; background:#F2F2F2} |
|||
|
|||
</style> |
|||
@ -0,0 +1,628 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="swiper-container"> |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{product.pics.length}}</view> |
|||
</view> |
|||
<view class="collage_title"> |
|||
<view class="f1"> |
|||
<view class="t1"> |
|||
<view class="x1">¥</view> |
|||
<view class="x2">{{product.sell_price}}</view> |
|||
<view class="x3">{{product.teamnum}}人团</view> |
|||
</view> |
|||
<view class="t2">单买价:¥{{product.market_price}}</view> |
|||
</view> |
|||
<view class="f2">已拼{{product.sales}}件</view> |
|||
</view> |
|||
|
|||
<view class="header"> |
|||
<view class="title"> |
|||
<view class="lef"> |
|||
<text>{{product.name}}</text> |
|||
</view> |
|||
<view class="share" @tap="shareClick"> |
|||
<image :src="event_rul + '/static/img/static/img/share.png'"></image> |
|||
<text>分享</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="teamlist" v-if="teamCount > 0"> |
|||
<view class="label">{{teamCount}}人在拼单,可直接参与</view> |
|||
<scroll-view :scroll-y="true" class="content"> |
|||
<view v-for="(item, index) in teamList" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image :src="item.headimg"></image> |
|||
<view class="t1">{{item.nickname}}</view> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">还差{{item.teamnum - item.num}}人拼成</view> |
|||
<view class="t2">剩余{{item.djs}}</view> |
|||
</view> |
|||
<button class="f3" @tap="buydialogShow" data-btntype="3" :data-teamid="item.id">去拼单</button> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<view class="commentbox" v-if="shopset.comment==1 && commentcount > 0"> |
|||
<view class="title"> |
|||
<view class="f1">评价({{commentcount}})</view> |
|||
<view class="f2" @tap="goto" :data-url="'commentlist?proid=' + product.id">好评度 <text :style="{color:t('color1')}">{{product.comment_haopercent}}%</text><image style="width:32rpx;height:32rpx;" :src="event_rul + '/static/img/static/img/arrowright.png'"/></view> |
|||
</view> |
|||
<view class="comment"> |
|||
<view class="item" v-if="commentlist.length>0"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="commentlist[0].headimg"/> |
|||
<view class="t2">{{commentlist[0].nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (commentlist[0].score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{commentlist[0].content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="commentlist[0].content_pic!=''"> |
|||
<block v-for="(itemp, index) in commentlist[0].content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="commentlist[0].content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" @tap="goto" :data-url="'commentlist?proid=' + product.id">查看全部评价</view> |
|||
</view> |
|||
<view v-else class="nocomment">暂无评价~</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="shop" v-if="shopset.showjd==1"> |
|||
<image :src="business.logo" class="p1"/> |
|||
<view class="p2 flex1"> |
|||
<view class="t1">{{business.name}}</view> |
|||
<view class="t2">{{business.desc}}</view> |
|||
</view> |
|||
<button class="p4" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" :data-url="product.bid==0?'/pages/index/index':'/pages/business/index?id='+product.bid" data-opentype="reLaunch">进入店铺</button> |
|||
</view> |
|||
<view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">商品描述</view><view class="t2"></view><view class="t1"></view></view> |
|||
<view class="detail"> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
</view> |
|||
|
|||
|
|||
<view style="width:100%;height:70px;"></view> |
|||
|
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':'notabbarbot'" v-if="product.status==1"> |
|||
<view class="cart flex-col flex-x-center flex-y-center" @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="cart flex-col flex-x-center flex-y-center" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
<view class="favorite flex-col flex-x-center flex-y-center" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
<view class="tocart" :style="{background:t('color2')}" @tap="buydialogShow" data-btntype="1"><text>¥{{product.market_price}}</text><text>单独购买</text></view> |
|||
<view class="tobuy" :style="{background:t('color1')}" @tap="buydialogShow" data-btntype="2"><text>¥{{product.sell_price}}</text><text>发起拼团</text></view> |
|||
</view> |
|||
|
|||
|
|||
<view :hidden="buydialogHidden"> |
|||
<view class="buydialog-mask"> |
|||
<view class="buydialog" :class="menuindex>-1?'tabbarbot':'notabbarbot'"> |
|||
<view class="close" @tap="buydialogChange"> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="image"></image> |
|||
</view> |
|||
<view class="title"> |
|||
<image :src="guigelist[ks].pic?guigelist[ks].pic:product.pic" class="img" @tap="previewImage" :data-url="guigelist[ks].pic?guigelist[ks].pic:product.pic"></image> |
|||
<!-- <text class="name">{{product.name}}</text> --> |
|||
<view class="price" v-if="btntype==1"><text class="t1">¥</text>{{guigelist[ks].market_price}}</view> |
|||
<view class="price" v-else><text class="t1">¥</text>{{guigelist[ks].sell_price}} <text v-if="guigelist[ks].market_price > guigelist[ks].sell_price" class="t2">¥{{guigelist[ks].market_price}}</text></view> |
|||
<view class="choosename">已选规格: {{guigelist[ks].name}}</view> |
|||
<view class="stock">剩余{{guigelist[ks].stock}}件</view> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in guigedata" :key="index" class="guigelist flex-col"> |
|||
<view class="name">{{item.title}}</view> |
|||
<view class="item flex flex-y-center"> |
|||
<block v-for="(item2, index2) in item.items" :key="index2"> |
|||
<view :data-itemk="item.k" :data-idx="item2.k" :class="'item2 ' + (ggselected[item.k]==item2.k ? 'on':'')" @tap="ggchange">{{item2.title}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="flex1">购买数量:</view> |
|||
<view class="addnum"> |
|||
<view class="minus"><image class="img" :src="event_rul + '/static/img/static/img/cart-minus.png'" @tap="gwcminus"/></view> |
|||
<input class="input" type="number" :value="gwcnum" @input="gwcinput"></input> |
|||
<view class="plus"><image class="img" :src="event_rul + '/static/img/static/img/cart-plus.png'" @tap="gwcplus"/></view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="btntype==1"> |
|||
<button class="tobuy" :style="{background:t('color2')}" @tap="tobuy" data-type="1">确定</button> |
|||
</block> |
|||
<block v-if="btntype==2"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="2">下一步</button> |
|||
</block> |
|||
<block v-if="btntype==3"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="3">确 定</button> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image src="https://dev.lansoft.shop/static/img/static/img/close.png" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul + '/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
indexurl:app.globalData.indexurl, |
|||
tabnum: 1, |
|||
buydialogHidden: true, |
|||
num: 1, |
|||
teamCount:0, |
|||
sysset:{}, |
|||
shopset:{}, |
|||
isfavorite: false, |
|||
btntype: 1, |
|||
ggselected: [], |
|||
guigedata:[], |
|||
guigelist:[], |
|||
ks: '', |
|||
gwcnum: 1, |
|||
nodata: 0, |
|||
product:{}, |
|||
userinfo: [], |
|||
current: 0, |
|||
pagecontent: "", |
|||
business:{}, |
|||
commentcount:0, |
|||
commentlist:[], |
|||
nowtime: "", |
|||
teamList: [], |
|||
teamid: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
kfurl:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var id = that.opt.id; |
|||
that.loading = true; |
|||
app.get('ApiCollage/product', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var pagecontent = JSON.parse(res.product.detail); |
|||
that.pagecontent = pagecontent; |
|||
that.business = res.business; |
|||
that.commentcount = res.commentcount; |
|||
that.commentlist = res.commentlist; |
|||
that.ggselected = res.ggselected; |
|||
that.guigedata = res.guigedata; |
|||
that.guigelist = res.guigelist; |
|||
that.isfavorite = res.isfavorite; |
|||
that.ks = res.ks; |
|||
that.nowtime = res.nowtime; |
|||
that.product = res.product; |
|||
that.shopset = res.shopset; |
|||
that.sysset = res.sysset; |
|||
that.teamCount = res.teamCount; |
|||
that.teamList = res.teamList; |
|||
setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
uni.setNavigationBarTitle({ |
|||
title: res.product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+res.product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.loaded({title:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current; |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var nowtime = that.nowtime; |
|||
for (var i in that.teamList) { |
|||
var thisteam = that.teamList[i]; |
|||
var totalsec = thisteam.createtime * 1 + thisteam.teamhour * 3600 - nowtime * 1; |
|||
if (totalsec <= 0) { |
|||
that.teamList[i].djs = '00时00分00秒'; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
that.teamList[i].djs = djs; |
|||
} |
|||
that.teamList = that.teamList |
|||
} |
|||
}, |
|||
//加入购物车 |
|||
buydialogShow: function (e) { |
|||
var btntype = e.currentTarget.dataset.btntype; |
|||
if (btntype == 3) { |
|||
this.teamid = e.currentTarget.dataset.teamid |
|||
} |
|||
this.btntype = btntype; |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
buydialogChange: function (e) { |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
//选择规格 |
|||
ggchange: function (e) { |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var itemk = e.currentTarget.dataset.itemk; |
|||
var ggselected = this.ggselected; |
|||
ggselected[itemk] = idx; |
|||
var ks = ggselected.join(','); |
|||
this.ggselected = ggselected; |
|||
this.ks = ks; |
|||
}, |
|||
tobuy: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var ks = that.ks; |
|||
var proid = that.product.id; |
|||
var ggid = that.guigelist[ks].id; |
|||
var num = that.gwcnum; |
|||
app.goto('buy?proid=' + proid + '&ggid=' + ggid + '&num=' + num + '&buytype=' + type + (type == 3 ? '&teamid=' + that.teamid : '')); |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var gwcnum = this.gwcnum + 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum + 1 |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var gwcnum = this.gwcnum - 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum <= 0) { |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum - 1 |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var ggselected = this.ks; |
|||
var gwcnum = parseInt(e.detail.value); |
|||
if (gwcnum < 1) return 1; |
|||
|
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
return this.guigelist[ggselected].stock; |
|||
} |
|||
this.gwcnum = gwcnum; |
|||
}, |
|||
//收藏操作 |
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.showLoading('收藏中'); |
|||
app.post('ApiCollage/addfavorite', {proid: proid,type: 'collage'}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
tabClick: function (e) { |
|||
this.tabnum = e.currentTarget.dataset.num; |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiCollage/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false;; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/collage/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/collage/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 750rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
|
|||
.header {width: 100%;padding: 0 3%;background: #fff;} |
|||
.header .title {padding: 10px 0px;line-height:44rpx;font-size:32rpx;display:flex;} |
|||
.header .title .lef{display:flex;flex-direction:column;justify-content: center;flex:1;color:#222222;font-weight:bold} |
|||
.header .title .lef .t2{ font-size:26rpx;color:#999;padding-top:10rpx;font-weight:normal} |
|||
.header .title .share{width:88rpx;height:88rpx;padding-left:20rpx;border-left:0 solid #f5f5f5;text-align:center;font-size:24rpx;color:#222;display:flex;flex-direction:column;align-items:center} |
|||
.header .title .share image{width:32rpx;height:32rpx;margin-bottom:4rpx} |
|||
|
|||
.header .price{height: 86rpx;overflow: hidden;line-height: 86rpx;border-top: 1px solid #eee;} |
|||
.header .price .t1 .x1{ color: #e94745; font-size: 34rpx;} |
|||
.header .price .t1 .x2{ color: #939393; margin-left: 10rpx; text-decoration: line-through;font-size:24rpx} |
|||
.header .price .t2{color: #aaa; font-size: 24rpx;} |
|||
.header .fuwupoint{width:100%;font-size:24rpx;color:#999;display:flex;flex-wrap:wrap;border-top:1px solid #eee;padding:10rpx 0} |
|||
.header .fuwupoint .t{ padding:4rpx 20rpx 4rpx 0} |
|||
.header .fuwupoint .t:before{content: ""; display: inline-block; vertical-align: middle; margin-top: -4rpx; margin-right: 10rpx; width: 24rpx; height: 24rpx; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUdwTOU5O+Q5POU5POQ4O+U4PN80P+M4O+Q4O+Q4POQ5POQ4OuQ4O+Q4O+I4PuQ5PJxkAycAAAAPdFJOUwAf+VSoeAvzws7ka7miLboUzckAAADJSURBVBjTY2BgYGCMWVR5VIABDBid/gPBFwjP/JOzQKKtfjGIzf3fEUSJ/N8AJO21Iao3fQbqqA+AcLi/CzCwfGGAAn8HBnlFMIttBoP4R4b4C2BOzk8G3q8M5w3AnPsLGZj/MKwHW8b6/QED4y8G/QQQx14ZSHwCcWYkMOtvAHOAyvqnPf8KcuMvkAGZP9eDjAQaEO/AwDb/D0gj0GiQpRnTQIYIfUR1DopDGexVIZygz8ieC4B6WyzRBOJtBkZ/pAABBZUWOKgAispF5e7ibycAAAAASUVORK5CYII=') no-repeat; background-size: 24rpx auto; } |
|||
.choose{ display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; height: 80rpx; line-height: 80rpx; padding: 0 3%; color: #505050; } |
|||
.choose .f2{ width: 40rpx; height: 40rpx;} |
|||
|
|||
.teamlist{ width:100%;background:#fff;padding:10rpx 20rpx;font-size:26rpx;margin-top:20rpx;display:flex;flex-direction:column} |
|||
.teamlist .label{ width:100%;color:#222222;font-weight:bold;padding:10rpx 0;border-bottom:1px solid #eee} |
|||
.teamlist .content{ width:100%;max-height:300rpx;overflow:scroll} |
|||
.teamlist .item{width:100%;display:flex;align-items:center;padding:12rpx 3px;border-bottom:0px solid #f5f5f5} |
|||
.teamlist .item .f1{width:300rpx;overflow:hidden;flex:auto;display:flex;align-items:center} |
|||
.teamlist .item .f1 image{width:80rpx;height:80rpx;} |
|||
.teamlist .item .f1 .t1{padding-left:6rpx;font-size:30rpx;color:#333} |
|||
.teamlist .item .f2{ text-align:right;margin:0 8rpx} |
|||
.teamlist .item .f2 .t1{font-size:24rpx;color:#333} |
|||
.teamlist .item .f2 .t2{font-size:22rpx;color:#999} |
|||
.teamlist .item .f3{ background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);color:#fff;border-radius:26rpx;padding:0 20rpx;height:50rpx;border:0;text-align:right;font-size:26rpx;display:flex;align-items:center} |
|||
.teamlist .item .f3:after{border:0} |
|||
|
|||
|
|||
.shop{display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 100rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:6rpx;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:60rpx;margin-bottom:30rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.commentbox{width:100%;background:#fff;padding:0 3%;margin-top:20rpx} |
|||
.commentbox .title{height:90rpx;line-height:90rpx;border-bottom:1px solid #DDDDDD;display:flex} |
|||
.commentbox .title .f1{flex:1;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.commentbox .title .f2{color:#333;font-weight:bold;font-size:28rpx;display:flex;align-items:center} |
|||
.commentbox .nocomment{height:100rpx;line-height:100rpx} |
|||
|
|||
.comment{display:flex;flex-direction:column;min-height:200rpx;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{margin:20rpx auto;padding:0 30rpx;height:60rpx;line-height:60rpx;border:1px solid #E6E6E6;border-radius:30rpx;color:#111111;font-weight:bold;font-size:26rpx} |
|||
|
|||
.bottombar{ width: 100%; position: fixed;bottom: 0px; left: 0px; background: #fff;} |
|||
.bottombar .favorite{width: 15%;color:#707070;font-size:26rpx} |
|||
.bottombar .favorite .fa{ font-size:40rpx;height:50rpx;line-height:50rpx} |
|||
.bottombar .favorite .img{ width:50rpx;height:50rpx} |
|||
.bottombar .favorite .t1{font-size:24rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .cart{width: 15%;font-size:26rpx;color:#707070} |
|||
.bottombar .cart .img{ width:50rpx;height:50rpx} |
|||
.bottombar .cart .t1{font-size:24rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .tocart{ width: 30%; height: 100rpx;color: #fff; background: #fa938a; font-size: 28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.bottombar .tobuy{ width:40%; height: 100rpx;color: #fff; background: #df2e24; font-size:28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
|
|||
|
|||
|
|||
.buydialog-mask{ position: fixed; top: 0px; left: 0px; width: 100%; background: rgba(0,0,0,0.5); bottom: 0px;z-index:10} |
|||
.buydialog{ position: fixed; width: 100%; left: 0px; bottom: 0px; background: #fff;z-index:11;border-radius:20rpx 20rpx 0px 0px} |
|||
.buydialog .close{ position: absolute; top: 0; right: 0;padding:20rpx;z-index:12} |
|||
.buydialog .close .image{ width: 30rpx; height:30rpx; } |
|||
.buydialog .title{ width: 94%;position: relative; margin: 0 3%; padding:20rpx 0px; border-bottom:0; height: 190rpx;} |
|||
.buydialog .title .img{ width: 160rpx; height: 160rpx; position: absolute; top: 20rpx; border-radius: 10rpx; border: 0 #e5e5e5 solid;background-color: #fff} |
|||
.buydialog .title .price{ padding-left:180rpx;width:100%;font-size: 36rpx;height:70rpx; color: #FC4343;overflow: hidden;} |
|||
.buydialog .title .price .t1{ font-size:26rpx} |
|||
.buydialog .title .price .t2{ font-size:26rpx;text-decoration:line-through;color:#aaa} |
|||
.buydialog .title .choosename{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
.buydialog .title .stock{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
|
|||
.buydialog .guigelist{ width: 94%; position: relative; margin: 0 3%; padding:0px 0px 10px 0px; border-bottom: 0; } |
|||
.buydialog .guigelist .name{ height:70rpx; line-height: 70rpx;} |
|||
.buydialog .guigelist .item{ font-size: 30rpx;color: #333;flex-wrap:wrap} |
|||
.buydialog .guigelist .item2{ height:60rpx;line-height:60rpx;margin-bottom:4px;border:0; border-radius:4rpx; padding:0 40rpx;color:#666666; margin-right: 10rpx; font-size:26rpx;background:#F4F4F4} |
|||
.buydialog .guigelist .on{color:#FC4343;background:rgba(252,67,67,0.1);font-weight:bold} |
|||
.buydialog .buynum{ width: 94%; position: relative; margin: 0 3%; padding:10px 0px 10px 0px; } |
|||
.buydialog .addnum {font-size: 30rpx;color: #666;width:auto;display:flex;align-items:center} |
|||
.buydialog .addnum .plus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .minus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .img{width:24rpx;height:24rpx} |
|||
.buydialog .addnum .input{flex:1;width:70rpx;border:0;text-align:center;color:#2B2B2B;font-size:24rpx} |
|||
.buydialog .op{width:90%;margin:20rpx 5%;border-radius:36rpx;overflow:hidden;display:flex;margin-top:100rpx;} |
|||
.buydialog .addcart{flex:1;height:72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none; font-size:28rpx;font-weight:bold} |
|||
.buydialog .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;} |
|||
.buydialog .nostock{flex:1;height: 72rpx; line-height: 72rpx; background:#aaa; color: #fff; border-radius: 0px; border: none;} |
|||
|
|||
.collage_title{width:100%;height:110rpx;background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);display:flex;align-items:center;padding:0 40rpx} |
|||
.collage_title .f1{flex:1;display:flex;flex-direction:column;} |
|||
.collage_title .f1 .t1{display:flex;align-items:center;height:60rpx;line-height:60rpx} |
|||
.collage_title .f1 .t1 .x1{font-size:28rpx;color:#fff} |
|||
.collage_title .f1 .t1 .x2{font-size:48rpx;color:#fff;padding-right:20rpx} |
|||
.collage_title .f1 .t1 .x3{font-size:24rpx;font-weight:bold;height:40rpx;line-height:40rpx;padding:0 20rpx;border-radius:20rpx;background:#fff;color:#ED533A} |
|||
.collage_title .f1 .t2{color:rgba(255,255,255,0.6);font-size:20rpx;} |
|||
.collage_title .f2{color:#fff;font-size:28rpx;} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
</style> |
|||
@ -0,0 +1,99 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<form @submit="formSubmit" @reset="formReset" report-submit="true"> |
|||
<view class="form-item"> |
|||
<text class="label">退款原因</text> |
|||
<view class="input-item"><textarea placeholder="请输入退款原因" placeholder-style="color:#999;" name="reason"></textarea></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退款金额(元)</text> |
|||
<view class="flex"><input name="money" type="digit" :value="totalprice" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<button class="ref-btn" form-type="submit">确定</button> |
|||
</form> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderid: 0, |
|||
totalprice: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
var that = this; |
|||
that.orderid = that.opt.orderid; |
|||
that.totalprice = that.opt.price; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.loaded(); |
|||
}, |
|||
formSubmit: function (e) { |
|||
//console.log(e);return; |
|||
var that = this; |
|||
var orderid = that.orderid; |
|||
var reason = e.detail.value.reason; |
|||
var money = parseFloat(e.detail.value.money); |
|||
|
|||
if (reason == '') { |
|||
app.alert('请填写退款原因'); |
|||
return; |
|||
} |
|||
|
|||
if (money < 0 || money > parseFloat(that.totalprice)) { |
|||
app.alert('退款金额有误'); |
|||
return; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiCollage/refund', { |
|||
orderid: orderid, |
|||
reason: reason, |
|||
money: money |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
app.alert(data.msg); |
|||
var pages = getCurrentPages(); |
|||
|
|||
if (pages.length > 1) { |
|||
var prePage = pages[pages.length - 2]; |
|||
prePage.onLoad(); |
|||
} |
|||
|
|||
setTimeout(function () { |
|||
app.goback(); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item{ width:100%;background: #fff; padding: 32rpx 20rpx;} |
|||
.form-item .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item .input-item{ width:100%;} |
|||
.form-item textarea{ width:100%;height:200rpx;border: 1px #eee solid;padding: 20rpx;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx} |
|||
.form-item .mid{ height:80rpx;line-height:80rpx;padding:0 20rpx;} |
|||
.ref-btn{ width: 90%; margin: 0 5%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 8px;border: none; background: #ff8758; } |
|||
</style> |
|||
@ -0,0 +1,413 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="topbg"> |
|||
<image :src="pre_url + '/static/img/collage_teambg.png'" class="image"/> |
|||
</view> |
|||
<view class="topbox" @tap="goto" :data-url="'product?id=' + product.id"> |
|||
<view class="left"> |
|||
<image :src="product.pic"></image> |
|||
</view> |
|||
<view class="right"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2"><view class="t1">{{product.teamnum}}人团</view></view> |
|||
<view class="f3"> |
|||
<view class="t1">¥</view> |
|||
<view class="t2">{{product.sell_price}}</view> |
|||
<view class="t3">{{product.sales}}人已拼</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="teambox"> |
|||
<view class="userlist"> |
|||
<view v-for="(item, index) in userlist" :key="index" class="item"> |
|||
<image :src="item.headimg?item.headimg: event_rul +'/static/img/static/img/wh.png'" class="f1"></image> |
|||
<text class="f2" v-if="item.id == team.mid">团长</text> |
|||
</view> |
|||
</view> |
|||
<view class="join-text" v-if="team.status==1"> |
|||
<view>仅剩<text class="join-te1">{{team.teamnum-team.num}}</text>个名额</view> |
|||
<view style="font-size:28rpx;color:#f80"> {{rtimeformat}} 后结束</view> |
|||
</view> |
|||
<view class="join-text" v-if="team.status==2">已满员,拼团成功</view> |
|||
<view class="join-text" v-if="team.status==3">拼团失败</view> |
|||
<button class="join-btn" @tap="shareClick" v-if="team.status==1 && haveme==1">邀请好友参团</button> |
|||
<button class="join-btn" @tap="buydialogChange" v-if="team.status==1 && haveme==0">我要参团</button> |
|||
</view> |
|||
<view :hidden="buydialogHidden"> |
|||
<view class="buydialog-mask"> |
|||
<view class="buydialog"> |
|||
<view class="close" @tap="buydialogChange"> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="buydialog-canimg"></image> |
|||
</view> |
|||
<view class="title"> |
|||
<image :src="guigelist[ks].pic?guigelist[ks].pic:product.pic" class="img" @tap="previewImage" :data-url="guigelist[ks].pic?guigelist[ks].pic:product.pic"></image> |
|||
<view class="price"><text class="t1">¥</text>{{guigelist[ks].sell_price}} <text v-if="guigelist[ks].market_price > guigelist[ks].sell_price" class="t2">¥{{guigelist[ks].market_price}}</text></view> |
|||
<view class="choosename">已选规格: {{guigelist[ks].name}}</view> |
|||
<view class="stock">剩余{{guigelist[ks].stock}}件</view> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in guigedata" :key="index" class="guigelist flex-col"> |
|||
<view class="name">{{item.title}}</view> |
|||
<view class="item flex flex-y-center"> |
|||
<block v-for="(item2, index2) in item.items" :key="index2"> |
|||
<view :data-itemk="item.k" :data-idx="item2.k" :class="'item2 ' + (ggselected[item.k]==item2.k ? 'on':'')" @tap="ggchange">{{item2.title}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="flex1">购买数量:</view> |
|||
<view class="f2 flex flex-y-center"> |
|||
<text class="minus flex-x-center" @tap="gwcminus">-</text> |
|||
<input class="flex-x-center" type="number" :value="gwcnum" @input="gwcinput"></input> |
|||
<text class="plus flex-x-center" @tap="gwcplus">+</text> |
|||
</view> |
|||
</view> |
|||
<block> |
|||
<button class="tobuy" @tap="tobuy" data-type="3">确 定</button> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image src="https://dev.lansoft.shop/static/img/static/img/close.png" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul+ '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul+ '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul+ '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul+ '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul + '/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
tabnum: 1, |
|||
ggselected: [], |
|||
guigedata: [], |
|||
guigelist:[], |
|||
haveme:0, |
|||
ks: '', |
|||
gwcnum: 1, |
|||
showdetail: false, |
|||
buydialogHidden: true, |
|||
team: [], |
|||
userlist: [], |
|||
product: [], |
|||
rtime: '', |
|||
rtimeformat: '', |
|||
isfavorite: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
console.log(opt) |
|||
console.log(this.opt) |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:'就差你了,快来一起拼团~ ' + this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:'就差你了,快来一起拼团~ ' + this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var teamid = that.opt.teamid; |
|||
that.loading = true; |
|||
app.get('ApiCollage/team', {teamid: teamid}, function (res) { |
|||
that.loading = false; |
|||
|
|||
that.ggselected = res.ggselected; |
|||
that.guigedata = res.guigedata; |
|||
that.guigelist = res.guigelist; |
|||
that.haveme = res.haveme; |
|||
that.ks = res.ks; |
|||
that.product = res.product; |
|||
that.rtime = res.rtime; |
|||
that.shopset = res.shopset; |
|||
that.sysset = res.sysset; |
|||
that.team = res.team; |
|||
that.userlist = res.userlist; |
|||
that.getrtime(); |
|||
setInterval(function () { |
|||
that.getrtime(); |
|||
}, 1000); |
|||
that.loaded({title:'就差你了,快来一起拼团~ ',desc:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
buydialogChange: function (e) { |
|||
this.buydialogHidden = !this.buydialogHidden |
|||
}, |
|||
//选择规格 |
|||
ggchange: function (e) { |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var itemk = e.currentTarget.dataset.itemk; |
|||
var ggselected = this.ggselected; |
|||
ggselected[itemk] = idx; |
|||
var ks = ggselected.join(','); |
|||
this.ggselected = ggselected; |
|||
this.ks = ks; |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var gwcnum = this.gwcnum + 1; |
|||
var ggselected = this.ks; |
|||
|
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum + 1; |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var gwcnum = this.gwcnum - 1; |
|||
var ggselected = this.ks; |
|||
|
|||
if (gwcnum <= 0) { |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum - 1; |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var ggselected = this.ks; |
|||
var gwcnum = parseInt(e.detail.value); |
|||
if (gwcnum < 1) return 1; |
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
return this.guigelist[ggselected].stock; |
|||
} |
|||
this.gwcnum = gwcnum; |
|||
}, |
|||
tobuy: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var ggselected = that.ks; |
|||
var proid = that.product.id; |
|||
var ggid = that.guigelist[ggselected].id; |
|||
var num = that.gwcnum; //var prodata = proid + ',' + ggid + ',' + num; |
|||
|
|||
app.goto('buy?proid=' + proid + '&num=' + num + '&ggid=' + ggid + '&buytype=' + type + '&teamid=' + that.team.id); |
|||
}, |
|||
getrtime: function () { |
|||
var rtime = this.rtime - 1; |
|||
if (rtime < 0) { |
|||
this.rtimeformat = '0秒'; |
|||
this.rtime = rtime; |
|||
} else { |
|||
var hours = Math.floor(rtime / 3600); //计算相差分钟数 |
|||
var leave2 = rtime % 3600; //计算小时数后剩余的毫秒数 |
|||
var minutes = Math.floor(leave2 / 60); //计算相差秒数 |
|||
var seconds = leave2 % 60; //计算分钟数后剩余的毫秒数 |
|||
var rtimeformat = hours + "小时" + minutes + "分" + seconds + "秒"; |
|||
this.rtimeformat = rtimeformat; |
|||
this.rtime = rtime; |
|||
} |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiCollage/getTeamPoster', {proid: that.product.id,teamid: that.team.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/collage/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/collage/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.topbg{width:100%;height:248rpx;position:relative;z-index:0} |
|||
.topbg .image{width:100%;height:100%} |
|||
.topbox{width:94%;margin:0 3%;margin-top:-140rpx;background:#fff;border-radius:16rpx;padding:24rpx;display:flex;position:relative;z-index:1} |
|||
.topbox .left{flex-shrink:0;width:240rpx;height:240rpx;} |
|||
.topbox .left image{width:100%;height:100%} |
|||
.topbox .right{flex:1;padding-left:20rpx;padding-right:20rpx;display:flex;flex-direction:column} |
|||
.topbox .right .f1{color:#32201B;height:80rpx;line-height:40rpx;font-size:30rpx;font-weight:bold;overflow:hidden} |
|||
.topbox .right .f2{display:flex;margin-top:10rpx} |
|||
.topbox .right .f2 .t1{display:flex;background:rgba(255, 49, 67,0.2);border-radius:20rpx;padding:0 20rpx;height:40rpx;line-height:40rpx;color:#FF3143;font-size:24rpx;} |
|||
.topbox .right .f3{display:flex;align-items:center;color:#FF3143;margin-top:40rpx} |
|||
.topbox .right .f3 .t1{font-size:28rpx} |
|||
.topbox .right .f3 .t2{font-size:40rpx;font-weight:bold;flex:1} |
|||
.topbox .right .f3 .t3{font-size:26rpx;font-weight:bold;} |
|||
|
|||
.teambox{width:94%;margin:0 3%;margin-top:20rpx;background:#fff;border-radius:16rpx;padding:24rpx;display:flex;flex-direction:column} |
|||
|
|||
.userlist{width: 100%;background: #fff;text-align: center;padding-top:40rpx;margin-top:20rpx;} |
|||
.userlist .item{display: inline-block;width:120rpx; height:120rpx;position: relative;} |
|||
.userlist .item .f1{width:100rpx; height:100rpx;border-radius: 50%;border: 1px #ffc32a solid;} |
|||
.userlist .item .f2{background: #ffab33;border-radius:100rpx;padding:4rpx 16rpx;border:1px #fff solid;position: absolute;top: 0px; left: -20rpx;color: #9f7200;font-size: 30rpx;} |
|||
|
|||
.join-text{color:#000;padding: 30rpx 0;font-size:36rpx;font-weight: 600;background: #fff; text-align: center;width: 100%;} |
|||
|
|||
.join-btn{width: 90%;margin:20rpx 5%;background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);color: #fff;font-size: 30rpx;height:80rpx;border-radius:40rpx} |
|||
|
|||
.buydialog-mask{ position: fixed; top: 0px; left: 0px; width: 100%; background: rgba(0,0,0,0.5); bottom: 0px;z-index:9} |
|||
.buydialog{ position: absolute; width: 100%; left: 0px; bottom: 0px; background: #fff;z-index:9} |
|||
.buydialog .close{ position: absolute; top: 0; right: 0;padding:20rpx;z-index:9999} |
|||
.buydialog .close image{ width: 30rpx; height:30rpx; } |
|||
.buydialog .title{ width: 94%;position: relative; margin: 0 3%; padding:20rpx 0px; border-bottom: 1px #e5e5e5 solid; height: 140rpx;} |
|||
.buydialog .title .img{ width: 160rpx; height: 160rpx; position: absolute; top: -40rpx; border-radius: 10rpx; border: 1px #e5e5e5 solid;background-color: #fff} |
|||
.buydialog .title .price{ padding-left:180rpx;width:100%;font-size: 36rpx;height:50rpx; color: #ff4a03;overflow: hidden;} |
|||
.buydialog .title .price .t1{ font-size:24rpx} |
|||
.buydialog .title .price .t2{ font-size:26rpx;text-decoration:line-through;color:#aaa} |
|||
.buydialog .title .choosename{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 30rpx;line-height:30rpx;} |
|||
.buydialog .title .stock{ padding-left:180rpx;width: 100%;font-size: 22rpx;height: 30rpx;line-height:30rpx;color:#aaa} |
|||
|
|||
.buydialog .guigelist{ width: 94%; position: relative; margin: 0 3%; padding:0px 0px 10px 0px; border-bottom: 1px #e5e5e5 solid; } |
|||
.buydialog .guigelist .name{ height:70rpx; line-height: 70rpx;} |
|||
.buydialog .guigelist .item{ font-size: 30rpx;color: #333;} |
|||
.buydialog .guigelist .item2{ height:50rpx;line-height:50rpx;border: 1px #a9a9a9 solid; border-radius:8rpx; padding:0 10rpx; color: #353535; margin-right: 10rpx; font-size:26rpx;} |
|||
.buydialog .guigelist .on{ border: 1px #ff4a03 solid;color: #ff4a03;} |
|||
.buydialog .buynum{ width: 94%; position: relative; margin: 0 3%; padding:10px 0px 10px 0px; } |
|||
.buydialog .buynum .f2{ border:1px solid #aaa} |
|||
.buydialog .buynum .f2 input{flex:1;width:70rpx;border-left:1px solid #aaa;border-right:1px solid #aaa;text-align:center} |
|||
.buydialog .buynum .f2 .plus{width:50rpx;} |
|||
.buydialog .buynum .f2 .minus{width:50rpx;} |
|||
.buydialog .addcart{height: 45px; line-height: 45px; background: #e94745; color: #fff; border-radius: 0px; border: none; font-size:16px; } |
|||
.buydialog .tobuy{ height: 45px; line-height: 45px; background: #ff6801; color: #fff; border-radius: 0px; border: none; font-size:16px; } |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
</style> |
|||
@ -0,0 +1,165 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="输入姓名/手机号搜索" placeholder-style="font-size:24rpx;color:#C2C2C2" @confirm="searchConfirm" @input="searchChange"></input> |
|||
</view> |
|||
</view> |
|||
<view v-for="(item, index) in datalist" :key="index" class="content" @tap.stop="setdefault" :data-id="item.id"> |
|||
<view class="f1"> |
|||
<text class="t1">{{item.name}}</text> |
|||
<text class="t2">{{item.tel}}</text> |
|||
<text class="t2" v-if="item.company">{{item.company}}</text> |
|||
<text class="flex1"></text> |
|||
<image class="t3" :src="event_rul + '/static/img/static/img/edit.png'" @tap.stop="goto" :data-url="'/activity/express/addressadd?id=' + item.id + '&type=' + (item.latitude>0 ? '1' : '0')"> |
|||
</view> |
|||
<view class="f2">{{item.area}} {{item.address}}</view> |
|||
<view class="f3"> |
|||
<view class="flex-y-center"> |
|||
<view class="radio" :style="item.isdefault ? 'border:0;background:'+t('color1') : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
<view class="mrtxt">{{item.isdefault ? '默认地址' : '设为默认'}}</view> |
|||
</view> |
|||
<view class="flex1"></view> |
|||
<view class="del" :style="{color:t('color1')}" @tap.stop="del" :data-id="item.id">删除</view> |
|||
</view> |
|||
</view> |
|||
<nodata v-if="nodata"></nodata> |
|||
<view style="height:140rpx"></view> |
|||
<block v-if="getplatform() == 'wx' && type == ''"> |
|||
<view class="btn-add2" :class="menuindex>-1?'tabbarbot':'notabbarbot3'" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" :data-url="'/activity/express/addressadd?type=' + type"><image :src="event_rul + '/static/img/static/img/add.png'" style="width:28rpx;height:28rpx;margin-right:6rpx"/>添加地址</view> |
|||
<view class="btn-add3" :class="menuindex>-1?'tabbarbot':'notabbarbot3'" :style="'background:linear-gradient(90deg,'+t('color2')+' 0%,rgba('+t('color2rgb')+',0.8) 100%)'" @tap="getweixinaddress"><image :src="event_rul + '/static/img/static/img/add.png'" style="width:28rpx;height:28rpx;margin-right:6rpx"/>获取微信地址</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn-add" :class="menuindex>-1?'tabbarbot':'notabbarbot3'" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" :data-url="'/activity/express/addressadd?type=' + type"><image :src="event_rul + '/static/img/static/img/add.png'" style="width:28rpx;height:28rpx;margin-right:6rpx"/>添加地址</view> |
|||
</block> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
type: "", |
|||
keyword:'', |
|||
nodata:false, |
|||
event_rul: app.globalData.event_url, |
|||
} |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.type = this.opt.type || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
app.get('ApiExpress/address', {type: that.opt.type,keyword:that.keyword}, function (res) { |
|||
that.loading = false; |
|||
var datalist = res.data; |
|||
if (datalist.length == 0 && that.keyword == ''){ |
|||
uni.redirectTo({ |
|||
url: '/activity/express/addressadd?type=' + (that.opt.type || 0) |
|||
}); |
|||
}else if(datalist.length == 0){ |
|||
that.datalist = datalist; |
|||
that.nodata = true; |
|||
}else{ |
|||
that.datalist = datalist; |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
//选择收货地址 |
|||
setdefault: function (e) { |
|||
var that = this; |
|||
var fromPage = this.opt.fromPage; |
|||
var mailtype = this.opt.mailtype; |
|||
var addressId = e.currentTarget.dataset.id; |
|||
app.post('ApiExpress/setdefault', {addressid: addressId,mailtype:mailtype}, function (data) { |
|||
if (fromPage) { |
|||
app.goback(true); |
|||
} else { |
|||
that.getdata(); |
|||
} |
|||
}); |
|||
}, |
|||
del: function (e) { |
|||
var that = this; |
|||
var addressId = e.currentTarget.dataset.id; |
|||
console.log(addressId); |
|||
app.confirm('确定要删除此地址吗?', function () { |
|||
app.post("ApiExpress/del", {addressid: addressId}, function (res) { |
|||
app.success(res.msg); |
|||
that.getdata(); |
|||
}); |
|||
}); |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword; |
|||
that.getdata(); |
|||
}, |
|||
getweixinaddress:function(){ |
|||
var that = this; |
|||
wx.chooseAddress({ |
|||
success (res) { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiExpress/addressadd', {type: that.type,addressid: '',name: res.userName,tel: res.telNumber,area: res.provinceName+','+res.cityName+','+res.countyName,address: res.detailInfo}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.getdata(); |
|||
app.success('添加成功'); |
|||
}); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.topsearch{width:94%;margin:16rpx 3%;} |
|||
.topsearch .f1{height:60rpx;border-radius:30rpx;border:0;background-color:#fff;flex:1} |
|||
.topsearch .f1 .img{width:24rpx;height:24rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
.content{width:94%;margin:20rpx 3%;background:#fff;border-radius:5px;padding:20rpx 40rpx;} |
|||
.content .f1{height:96rpx;line-height:96rpx;display:flex;align-items:center} |
|||
.content .f1 .t1{color:#2B2B2B;font-weight:bold;font-size:30rpx} |
|||
.content .f1 .t2{color:#999999;font-size:28rpx;margin-left:10rpx} |
|||
.content .f1 .t3{width:28rpx;height:28rpx} |
|||
.content .f2{color:#2b2b2b;font-size:26rpx;line-height:42rpx;padding-bottom:20rpx;border-bottom:1px solid #F2F2F2} |
|||
.content .f3{height:96rpx;display:flex;align-items:center} |
|||
.content .radio{flex-shrink:0;width: 36rpx;height: 36rpx;background: #FFFFFF;border: 3rpx solid #BFBFBF;border-radius: 50%;} |
|||
.content .radio .radio-img{width:100%;height:100%} |
|||
.content .mrtxt{color:#2B2B2B;font-size:26rpx;margin-left:10rpx} |
|||
.content .del{font-size:24rpx} |
|||
|
|||
.container .btn-add{width:90%;max-width:700px;margin:0 auto;height:96rpx;line-height:96rpx;text-align:center;color:#fff;font-size:30rpx;font-weight:bold;border-radius:40rpx;position: fixed;left:0px;right:0;bottom:0;margin-bottom:20rpx;} |
|||
.container .btn-add2{width:43%;max-width:700px;margin:0 auto;height:96rpx;line-height:96rpx;text-align:center;color:#fff;font-size:30rpx;font-weight:bold;border-radius:40rpx;position: fixed;left:5%;bottom:0;margin-bottom:20rpx;} |
|||
.container .btn-add3{width:43%;max-width:700px;margin:0 auto;height:96rpx;line-height:96rpx;text-align:center;color:#fff;font-size:30rpx;font-weight:bold;border-radius:40rpx;position: fixed;right:5%;bottom:0;margin-bottom:20rpx;} |
|||
</style> |
|||
@ -0,0 +1,261 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">姓 名</text> |
|||
<input class="input" type="text" placeholder="请输入姓名" placeholder-style="font-size:28rpx;color:#BBBBBB" name="name" :value="name"></input> |
|||
</view> |
|||
<view class="form-item" v-if="showCompany"> |
|||
<text class="label">公 司</text> |
|||
<input class="input" type="text" placeholder="请输入公司或单位名称" placeholder-style="font-size:28rpx;color:#BBBBBB" name="company" :value="company"></input> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">手机号</text> |
|||
<input class="input" type="number" placeholder="请输入手机号" placeholder-style="font-size:28rpx;color:#BBBBBB" name="tel" :value="tel"></input> |
|||
</view> |
|||
<view class="form-item" v-if="type==1"> |
|||
<text class="label flex0">选择位置</text> |
|||
<text class="flex1" style="text-align:right" :style="area ? '' : 'color:#BBBBBB'" @tap="selectzuobiao" >{{area ? area : '请选择您的位置'}}</text> |
|||
<!-- <input class="input" type="text" placeholder="请选择您的位置" placeholder-style="font-size:28rpx;color:#BBBBBB" name="area" :value="area" @tap="selectzuobiao"></input> --> |
|||
</view> |
|||
<view class="form-item" v-else> |
|||
<text class="label flex1">所在地区</text> |
|||
<uni-data-picker :localdata="items" :border="false" :placeholder="regiondata || '请选择省市区'" @change="regionchange"></uni-data-picker> |
|||
<!-- <picker mode="region" name="regiondata" :value="regiondata" class="input" @change="bindPickerChange"> |
|||
<view class="picker" v-if="regiondata">{{regiondata}}</view> |
|||
<view v-else>请选择地区</view> |
|||
</picker> --> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">详细地址</text> |
|||
<input class="input" type="text" placeholder="请输入详细地址" placeholder-style="font-size:28rpx;color:#BBBBBB" name="address" :value="address"></input> |
|||
</view> |
|||
<view class="item flex-y-center" v-if="type!=1"> |
|||
<view class="f2 flex-y-center flex1"> |
|||
<input id="addressxx" placeholder="粘贴地址信息,可自动识别并填写,如:张三,188********,广东省 东莞市 xx区 xx街道 xxxx" placeholder-style="font-size:24rpx;color:#BBBBBB" style="width:85%;font-size:24rpx;margin:20rpx 0;height:100rpx;padding:4rpx 10rpx" @input="setaddressxx"></input> |
|||
<view style="width:15%;text-align:center;color:#999" @tap="shibie">识别</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<button class="savebtn" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" form-type="submit">保 存</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
name: '', |
|||
tel: '', |
|||
area: '', |
|||
address: '', |
|||
longitude: '', |
|||
latitude: '', |
|||
regiondata: '', |
|||
type: 0, |
|||
addressxx: '', |
|||
company: '', |
|||
items:[], |
|||
showCompany:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.type = this.opt.type || 0; |
|||
var that = this; |
|||
app.get('ApiIndex/getCustom',{}, function (customs) { |
|||
var url = app.globalData.pre_url+'/static/area.json'; |
|||
if(customs.data.includes('plug_zhiming')) { |
|||
url = app.globalData.pre_url+'/static/area_gaoxin.json'; |
|||
} |
|||
uni.request({ |
|||
url: url, |
|||
data: {}, |
|||
method: 'GET', |
|||
header: { 'content-type': 'application/json' }, |
|||
success: function(res2) { |
|||
that.items = res2.data |
|||
} |
|||
}); |
|||
}); |
|||
|
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var addressId = that.opt.id || ''; |
|||
app.get('ApiIndex/getCustom',{}, function (customs) { |
|||
if(customs.data.includes('plug_xiongmao')) { |
|||
that.showCompany = true; |
|||
} |
|||
}); |
|||
if(addressId) { |
|||
that.loading = true; |
|||
app.get('ApiExpress/addressadd', {id: addressId,type: that.type}, function (res) { |
|||
that.loading = false; |
|||
that.name = res.data.name; |
|||
that.tel = res.data.tel; |
|||
that.area = res.data.area; |
|||
that.address = res.data.address; |
|||
that.longitude = res.data.longitude; |
|||
that.latitude = res.data.latitude; |
|||
that.company = res.data.company; |
|||
if (res.data.province){ |
|||
var regiondata = res.data.province+ ',' + res.data.city+ ',' + res.data.district; |
|||
} else { |
|||
var regiondata = ''; |
|||
} |
|||
that.regiondata = regiondata |
|||
that.loaded(); |
|||
}); |
|||
}else{ |
|||
that.loaded(); |
|||
} |
|||
}, |
|||
regionchange(e) { |
|||
const value = e.detail.value |
|||
console.log(value[0].text + ',' + value[1].text + ',' + value[2].text); |
|||
this.regiondata = value[0].text + ',' + value[1].text + ',' + value[2].text |
|||
}, |
|||
selectzuobiao: function () { |
|||
var that = this; |
|||
uni.chooseLocation({ |
|||
success: function (res) { |
|||
console.log(res); |
|||
that.area = res.address; |
|||
that.address = res.name; |
|||
that.latitude = res.latitude; |
|||
that.longitude = res.longitude; |
|||
}, |
|||
fail: function (res) { |
|||
console.log(res) |
|||
if (res.errMsg == 'chooseLocation:fail auth deny') { |
|||
//$.error('获取位置失败,请在设置中开启位置信息'); |
|||
app.confirm('获取位置失败,请在设置中开启位置信息', function () { |
|||
uni.openSetting({}); |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var formdata = e.detail.value; |
|||
var addressId = that.opt.id || ''; |
|||
var name = formdata.name; |
|||
var tel = formdata.tel; |
|||
var regiondata = that.regiondata; |
|||
var mailtype = that.opt.mailtype || ''; |
|||
if (that.type == 1) { |
|||
var area = that.area; |
|||
if(area == '') { |
|||
app.error('请选择位置'); |
|||
return; |
|||
} |
|||
} else { |
|||
var area = regiondata; |
|||
if(area == '') { |
|||
app.error('请选择省市区'); |
|||
return; |
|||
} |
|||
} |
|||
var address = formdata.address; |
|||
var longitude = that.longitude; |
|||
var latitude = that.latitude; |
|||
var company = formdata.company; |
|||
|
|||
if (name == '' || tel == '' || address == '') { |
|||
app.error('请填写完整信息'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiExpress/addressadd', {mailtype:mailtype,type: that.type,addressid: addressId,name: name,tel: tel,area: area,address: address,latitude: latitude,longitude: longitude,company:company}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
app.success('保存成功'); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
}, |
|||
delAddress: function () { |
|||
var that = this; |
|||
var addressId = that.opt.id; |
|||
app.confirm('确定要删除该收获地址吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiExpress/del', {addressid: addressId}, function () { |
|||
app.showLoading(false); |
|||
app.success('删除成功'); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
bindPickerChange: function (e) { |
|||
var val = e.detail.value; |
|||
this.regiondata = val; |
|||
}, |
|||
setaddressxx: function (e) { |
|||
this.addressxx = e.detail.value; |
|||
}, |
|||
shibie: function () { |
|||
var that = this; |
|||
var addressxx = that.addressxx; |
|||
app.post('ApiExpress/shibie', {addressxx: addressxx}, function (res) { |
|||
var isrs = 0; |
|||
if (res.province) { |
|||
isrs = 1; |
|||
that.regiondata = res.province + ',' +res.city + ',' +res.county |
|||
} |
|||
if (res.detail) { |
|||
isrs = 1; |
|||
that.address = res.detail |
|||
} |
|||
if (res.person) { |
|||
isrs = 1; |
|||
that.name = res.person |
|||
} |
|||
if (res.phonenum) { |
|||
isrs = 1; |
|||
that.tel = res.phonenum |
|||
} |
|||
if (isrs == 0) { |
|||
app.error('识别失败'); |
|||
} else { |
|||
app.success('识别完成'); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{display:flex;flex-direction:column} |
|||
|
|||
.form{ width:94%;margin:20rpx 3%;border-radius:5px;padding: 0 3%;background: #FFF;} |
|||
.form-item{display:flex;align-items:center;width:100%;border-bottom: 1px #ededed solid;height:98rpx;} |
|||
.form-item:last-child{border:0} |
|||
.form-item .label{ color:#8B8B8B;font-weight:bold;height: 60rpx; line-height: 60rpx; text-align:left;width:150rpx;padding-right:20rpx} |
|||
.form-item .input{ flex:1;height: 60rpx; line-height: 60rpx;text-align:right} |
|||
.savebtn{ width: 90%; height:96rpx; line-height: 96rpx; text-align:center;border-radius:48rpx; color: #fff;font-weight:bold;margin: 0 5%; margin-top:60rpx; border: none; } |
|||
</style> |
|||
@ -0,0 +1,12 @@ |
|||
.tabbar{height: auto; position: relative;} |
|||
.tabbar-icon {width: 50rpx;height: 50rpx;} |
|||
.tabbar-bar {display: flex;flex-direction: row;width: 100%;height:100rpx;position: fixed;bottom: 0;padding:10rpx 0 0 0;background: #fff;font-size: 24rpx;color: #999;border-top: 1px solid #e5e5e5;z-index: 8;box-sizing:content-box} |
|||
.tabbar-item {flex: 1;text-align: center;overflow: hidden;} |
|||
.tabbar-image-box {height: 54rpx;margin-bottom: 4rpx;} |
|||
.tabbar-text {line-height: 30rpx;font-size: 24rpx;color:#222222} |
|||
.tabbar-text.active{color:#06A051} |
|||
.tabbar-bot{height:110rpx;width:100%;box-sizing:content-box} |
|||
@supports(bottom: env(safe-area-inset-bottom)){ |
|||
.tabbar-bot{padding-bottom:env(safe-area-inset-bottom);} |
|||
.tabbar-bar{padding-bottom:env(safe-area-inset-bottom);} |
|||
} |
|||
@ -0,0 +1,230 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view> |
|||
<view class="search-container" :style="{background:t('color1')}"> |
|||
<view class="search-box"> |
|||
<picker style="font-size:28rpx;padding:10rpx;height:70rpx;border-radius:4px;flex:1;" @change="expresschange" :value="express_index" :range="expressdata" > |
|||
<view class="picker" @change="expresschange" :value="express_index" :range="expressdata" >{{expressdata[express_index]?expressdata[express_index]:'请选择快递公司'}}</view> |
|||
</picker> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/exp_xiala.png'"></image> |
|||
<input class="search-text" :value="keyword" @confirm="searchConfirm" @input="searchChange" placeholder="输入快递单号或扫码查询" placeholder-style="color:#fff;font-size:24rpx"/> |
|||
<view class="set" @tap="saoyisao"> |
|||
<image :src="event_rul + '/static/img/static/img/ico-scan.png'" class="img"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="wrap"> |
|||
<view class="top_title flex"> |
|||
<view class="tab" @tap="goto" data-url="mail"><image :src="event_rul + '/static/img/static/img/exp_mail.png'"></image><text>我要寄件</text></view> |
|||
<view class="tab" @tap="goto" data-url="/pages/my/usercenter"><image :src="event_rul + '/static/img/static/img/exp_my.png'"></image><text>个人中心</text></view> |
|||
</view> |
|||
<view class="list_box"> |
|||
<view class="tab-box flex"> |
|||
<view :class="'tab2 ' + (curTopIndex == 1 ? 'on' : '')" :data-index="1" @tap="switchTopTab" >最近查询</view> |
|||
<view :class="'tab2 ' + (curTopIndex == 2 ? 'on' : '')" :data-index="2" @tap="switchTopTab" >我的寄件</view> |
|||
</view> |
|||
<view class="list" v-for="(item, index) in datalist" :key="index" v-if="curTopIndex==1" @tap="goto" :data-url="'/activity/express/logistics?com='+item.company+'&num='+item.num"> |
|||
<view class="text1 flex"><view>{{item.company}}:{{item.num}}<image class="fuzhi" :src="event_rul + '/static/img/static/img/exp_fuzhi.png'"></image></view><text class="t3">查</text></view> |
|||
<view class="text2 flex"> |
|||
<view class="t1_box"><text>{{item.text}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="list" v-for="(item, index) in datalist" :key="index" v-if="curTopIndex==2" @tap="goto" :data-url="'/activity/express/kddetail?id='+item.id" > |
|||
<view class="text1 flex"><view class="com">{{item.company}}</view><text class="t4">{{item.status}}</text></view> |
|||
<view class="text2 flex"> |
|||
<view class="t2_box"><text >{{item.sendManPrintCity}}</text><text class="t2">{{item.sendManName}}</text></view> |
|||
<view class="t2_box"><image class="jiantou" :src="event_rul + '/static/img/static/img/jiantou.png'"></image></view> |
|||
<view class="t2_box"><text>{{item.recManPrintCity}}</text><text class="t2">{{item.recManName}}</text></view> |
|||
</view> |
|||
</view> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata:false, |
|||
datalist:[], |
|||
pre_url:app.globalData.pre_url, |
|||
platform:'', |
|||
platformname:'', |
|||
platformimg:'weixin', |
|||
smsdjs: '', |
|||
tel:'', |
|||
hqing: 0, |
|||
frompage:'/pages/express/mail', |
|||
address: [], |
|||
expressdata:[], |
|||
express_index:-1, |
|||
express_no:'', |
|||
pstimeDialogShow: false, |
|||
pstimetext:'', |
|||
sm_time:'', |
|||
address2:[], |
|||
|
|||
keyword:'', |
|||
curTopIndex:1, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
var that=this |
|||
this.opt = app.getopts(opt); |
|||
that.loaded(); |
|||
this.getdatalist(); |
|||
|
|||
}, |
|||
methods: { |
|||
getdatalist: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var bid = that.opt.bid ? that.opt.bid : ''; |
|||
var order = that.order; |
|||
var keyword = that.keyword; |
|||
var field = that.field; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
var type=that.curTopIndex |
|||
app.post('ApiExpress/getLog', {pagenum: pagenum,keyword: keyword,field: field,order: order,bid:bid,type:type,}, function (res) { |
|||
that.loading = false; |
|||
uni.stopPullDownRefresh(); |
|||
var data = res.data.datalist; |
|||
if (data.length == 0) { |
|||
if(pagenum == 1){ |
|||
that.nodata = true; |
|||
}else{ |
|||
that.nomore = true; |
|||
} |
|||
} |
|||
that.expressdata = res.data.expressdata |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
}); |
|||
}, |
|||
expresschange:function(e){ |
|||
var that=this |
|||
that.express_index = e.detail.value; |
|||
console.log(that.express_index); |
|||
}, |
|||
|
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword; |
|||
var company = that.expressdata[that.express_index]; |
|||
app.goto('/activity/express/logistics?com=' +company+'&num='+keyword); |
|||
|
|||
}, |
|||
|
|||
bindPickerChange: function (e) { |
|||
var val = e.detail.value; |
|||
this.regiondata = val; |
|||
}, |
|||
setaddressxx: function (e) { |
|||
this.addressxx = e.detail.value; |
|||
}, |
|||
switchTopTab: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
this.curTopIndex = index; |
|||
this.getdatalist(); |
|||
}, |
|||
saoyisao: function (d) { |
|||
var that = this; |
|||
if(app.globalData.platform == 'h5'){ |
|||
app.alert('请使用微信扫一扫功能扫码核销');return; |
|||
}else if(app.globalData.platform == 'mp'){ |
|||
var jweixin = require('jweixin-module'); |
|||
jweixin.ready(function () { //需在用户可能点击分享按钮前就先调用 |
|||
jweixin.scanQRCode({ |
|||
needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果, |
|||
scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有 |
|||
success: function (res) { |
|||
var content = res.resultStr; // 当needResult 为 1 时,扫码返回的结果 |
|||
if(result.includes('CODE_128')){ |
|||
var params = content.split(',')[1]; |
|||
} |
|||
//location.href = content; |
|||
app.goto('/activity/express/logistics?num='+params); |
|||
//if(content.length == 18 && (/^\d+$/.test(content))){ //是十八位数字 付款码 |
|||
// location.href = "{:url('shoukuan')}/aid/{$aid}/auth_code/"+content |
|||
//}else{ |
|||
// location.href = content; |
|||
//} |
|||
} |
|||
}); |
|||
}); |
|||
}else{ |
|||
uni.scanCode({ |
|||
success: function (res) { |
|||
console.log(res); |
|||
var content = res.result; |
|||
var params = content.split(',')[1]; |
|||
app.goto('/activity/express/logistics?num='+params); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
@import "./common.css"; |
|||
.container{ width:100%;display:flex;flex-direction:column} |
|||
.search-container {width: 100%;height:250rpx;padding: 20rpx 23rpx 20rpx 23rpx;background-color: #FC4343;position: relative;overflow: hidden;border-bottom:1px solid #f5f5f5} |
|||
.search-box {margin-top:55rpx;display:flex;align-items:center;height:88rpx;border-radius:12rpx;border:0; background-color:rgba(247,247,247,0.2); flex:1; } |
|||
.search-box .img{width:40rpx;height:40rpx;margin-right:20rpx;margin-left:30rpx} |
|||
.search-box .search-text {font-size:26rpx;text-align:center;color:#fff;width: 100%;} |
|||
|
|||
.wrap{ background:#EDEDED; position: relative;top:-20rpx; padding:40rpx; border-radius: 24rpx;} |
|||
.top_title{ height: 180rpx; line-height: 180rpx; background: #fff; } |
|||
.top_title .tab{ width: 50%;display: flex; justify-content: center;} |
|||
.top_title image{ width: 64rpx; height: 64rpx; margin-top: 55rpx;} |
|||
.top_title .tab text{ line-height: 180rpx; color: #222222; font-size: 28rpx; font-weight: bold; margin-left: 10rpx;} |
|||
|
|||
.tab-box{ margin-top: 60rpx; font-size: 28rpx; margin-bottom:60rpx;} |
|||
.tab-box .tab2{ color:#666; margin-right: 30rpx;padding-bottom: 20rpx; } |
|||
.tab-box .tab2.on{ color: #222222; border-bottom:4rpx solid #222;} |
|||
|
|||
.list{ background: #fff; border-radius:12rpx ; margin-top: 20rpx;} |
|||
.list .text1{ border-bottom: 1px solid #eee; padding: 20rpx; justify-content: space-between;} |
|||
.list .text1 .com{ font-size: 24rpx; color:#888888} |
|||
.list .text1 .t4{font-size: 24rpx;color:#222222 } |
|||
.list .text1 .fuzhi{ width:28rpx; height: 28rpx; margin-left: 20rpx;} |
|||
.list .text1 .t3{ font-size:20rpx; color: #E2E2E2; border: 1px solid #E2E2E2;padding: 5rpx;} |
|||
.list .text2 .jiantou{ width: 124rpx; height: 16rpx;} |
|||
.list .text2{ justify-content: center; width:100%; padding: 40rpx; } |
|||
.list .text2 .t1_box{ width: 100%; font-size: 24rpx; color:#222} |
|||
.list .text2 .t1_box .t2{ display: flex; justify-content: center; font-size: 24rpx;color:#888; } |
|||
.list .text2 .t2_box{ width: 33.33%; text-align: center; font-size: 36rpx; color:#222} |
|||
.list .text2 .t2_box .t2{ display: flex; justify-content: center; font-size: 24rpx;color:#888; margin-top: 10rpx;} |
|||
|
|||
.picker{width:90rpx;color:#fff;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;text-align: right; line-height: 50rpx;} |
|||
|
|||
</style> |
|||
@ -0,0 +1,219 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="expressinfo"> |
|||
<view class="head"> |
|||
<view class="f1"><view v-if="data.kuaidinum">运单号:{{data.kuaidinum}}</view> |
|||
<view v-else>订单号:{{data.ordernum}}</view> |
|||
<view></view></view> |
|||
<view class="f2 flex"> |
|||
<view class="t2_box"><text>{{data.sendManPrintCity}}</text><text class="t2">{{data.sendManName}}</text></view> |
|||
<view class="t2_box"><image class="jiantou" :src="event_rul + '/static/img/static/img/jiantou.png'"></image><view class="t2">{{data.sta}}</view></view> |
|||
<view class="t2_box"><text>{{data.recManPrintCity}}</text><text class="t2">{{data.sendManName}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="content"> |
|||
|
|||
<block v-if="datalist"> |
|||
<view v-for="(item, index) in datalist" :key="index" :class="'item ' + (index==0?'on':'')"> |
|||
<view class="f1"><image :src="event_rul + '/static/img/static/img/dot' + (index==0?'2':'1') + '.png'"></image></view> |
|||
<view class="f2"> |
|||
<text class="t2">{{item.time}}</text> |
|||
<text class="t1">{{item.context}}</text> |
|||
</view> |
|||
</view> |
|||
<nodata v-if="nodata" text="暂未查找到物流信息"></nodata> |
|||
</block> |
|||
<view v-else class="item"> |
|||
<view class="f1"><image :src="event_rul + '/static/img/static/img/dot' + (index==0?'2':'1') + '.png'"></image></view> |
|||
<view class="f2"> |
|||
<text class="t2">{{data.sta}}</text> |
|||
<text class="t1"></text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
|
|||
<uni-popup id="dialogRemark" ref="dialogExpress" type="dialog"> |
|||
<view style="background:#fff;padding:20rpx 30rpx;border-radius:10rpx;width:600rpx" > |
|||
<form @submit="formSubmit"> |
|||
<view class="sendexpress-item" style="padding:20rpx 0;"> |
|||
<view> |
|||
<input class="input" type="text" placeholder="请输入原因" placeholder-style="font-size:28rpx;color:#BBBBBB" name="remark" ></input> |
|||
</view> |
|||
<button class="submit" form-type="submit" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'"> 确定取消</button> |
|||
</view> |
|||
</form> |
|||
</view> |
|||
</uni-popup> |
|||
|
|||
|
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
nodata:false, |
|||
express_com: '', |
|||
express_no: '', |
|||
datalist: [], |
|||
data:[], |
|||
orderinfo: {}, |
|||
prolist: [], |
|||
binfo: {}, |
|||
psuser: {}, |
|||
psorder: {}, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.id = that.opt.id; |
|||
that.loading = true; |
|||
app.post('ApiExpress/kddetail', {id: that.id}, function (res) { |
|||
that.loading = false; |
|||
that.data = res.data |
|||
var datalist = res.datalist; |
|||
if (datalist.length < 1) { |
|||
that.nodata = true; |
|||
} |
|||
that.datalist = datalist; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
call:function(e){ |
|||
var tel = e.currentTarget.dataset.tel; |
|||
uni.makePhoneCall({ |
|||
phoneNumber: tel |
|||
}); |
|||
}, |
|||
cancle:function(e){ |
|||
this.$refs.dialogExpress.open(); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var formdata = e.detail.value; |
|||
console.log(formdata); |
|||
if (formdata['remark'] == '' ) { |
|||
app.error('请填写原因'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiExpress/cancle', {id:that.id,remark: formdata['remark']}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 1) { |
|||
app.success('取消成功'); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}else{ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
|
|||
}); |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.expressinfo{} |
|||
.expressinfo .head { width:95%;background: #fff; margin:20rpx ;padding: 20rpx 20rpx;align-items:center; border-radius: 10rpx;} |
|||
.expressinfo .head .f1{margin-right:20rpx;border-bottom:1px solid #E2E2E2; height: 60rpx;} |
|||
.expressinfo .head .f1 image{width:100%;height:100%} |
|||
.expressinfo .head .f2{display:flex;font-size:30rpx;color:#999999; margin-top: 20rpx;} |
|||
.expressinfo .head .f2 .t1{margin-bottom:8rpx} |
|||
.expressinfo .content{ width: 95%; margin: 20rpx; border-radius: 10rpx; background: #fff;display:flex;flex-direction:column;color: #979797;padding:20rpx 40rpx; padding-bottom: 100rpx;;} |
|||
.expressinfo .content .on{color: #23aa5e;} |
|||
.expressinfo .content .item{display:flex;width: 96%; margin: 0 2%;border-left: 1px #dadada solid;padding:10rpx 0} |
|||
.expressinfo .content .item .f1{ width:40rpx;flex-shrink:0;position:relative} |
|||
.expressinfo .content image{width: 30rpx; height: 30rpx; position: absolute; left: -16rpx; top: 22rpx;} |
|||
/*.content .on image{ top:-1rpx}*/ |
|||
.expressinfo .content .item .f1 image{ width: 30rpx; height: 30rpx;} |
|||
|
|||
.expressinfo .content .item .f2{display:flex;flex-direction:column;flex:auto;} |
|||
.expressinfo .content .item .f2 .t1{font-size: 30rpx;} |
|||
.expressinfo .content .item .f2 .t1{font-size: 26rpx;} |
|||
|
|||
|
|||
.map{width:100%;height:500rpx;overflow:hidden} |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.order-box{ width: 94%;margin:20rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f5f5f5 solid; height:88rpx; line-height:88rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#222222} |
|||
.order-box .head .f1 .img{width:24rpx;height:24rpx;margin-right:4px} |
|||
.order-box .head .f1 .t1{color:#06A051;margin-right:10rpx} |
|||
.order-box .head .f2{color:#FF6F30} |
|||
.order-box .head .f2 .t1{font-size:36rpx;margin-right:4rpx} |
|||
|
|||
.order-box .content{display:flex;justify-content:space-between;width: 100%; padding:16rpx 0px;border-bottom: 1px solid #f5f5f5;position:relative} |
|||
.order-box .content .f1{width:100rpx;display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t1 .x2{color:#999999;font-size:24rpx;margin-bottom:8rpx} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx} |
|||
|
|||
.order-box .content .f1 .t3{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t3 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t3 .x2{color:#999999;font-size:24rpx} |
|||
.order-box .content .f2{} |
|||
.order-box .content .f2 .t1{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-bottom:6rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f2 .t2{font-size:24rpx;color:#222222;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f2 .t3{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-top:30rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f3 .img{width:72rpx;height:168rpx} |
|||
|
|||
.head .jiantou{ width: 124rpx; height: 16rpx;} |
|||
.head .t2_box{ width: 33.33%; text-align: center; font-size: 36rpx; color:#222} |
|||
.head .t2_box .t2{ display: flex; justify-content: center; font-size: 24rpx;color:#888; margin-top: 10rpx;} |
|||
|
|||
|
|||
.orderinfo{width: 94%;margin:20rpx 3%;margin-top:10rpx;padding: 14rpx 3%;background: #FFF;border-radius:8px} |
|||
.orderinfo .box-title{color:#161616;font-size:30rpx;height:80rpx;line-height:80rpx;font-weight:bold} |
|||
.orderinfo .item{display:flex;width:100%;padding:10rpx 0;} |
|||
.orderinfo .item .t1{width:200rpx;color:#161616} |
|||
.orderinfo .item .t2{flex:1;text-align:right;color:#222222} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;background: #fff; position: fixed; bottom: 0px;left: 0px;display:flex;align-items:center;height:100rpx;} |
|||
.bottom .f1{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55;border-right:1px solid #EAEEED} |
|||
.bottom .f1 .img{width:44rpx;height:44rpx} |
|||
.bottom .f2{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55} |
|||
.bottom .f2 .img{width:44rpx;height:44rpx} |
|||
.bottom .btn1{flex:1;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%);height:100rpx;line-height:100rpx;color:#fff;text-align:center;font-size:32rpx} |
|||
.tobuy{width: 80%; margin: auto; line-height: 72rpx;color: #fff; border-radius:40rpx; |
|||
background-color: #007AFF; border: none;font-size:28rpx;font-weight:bold; height: 80rpx; position: fixed; left:10%; bottom: 0;} |
|||
|
|||
.submit{ width:200rpx;height:80rpx; line-height: 80rpx; text-align:center;border-radius:10rpx; color: #fff;font-weight:bold; margin-top:60rpx; border: none; } |
|||
</style> |
|||
@ -0,0 +1,159 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="expressinfo"> |
|||
<view class="head"> |
|||
<view class="f1"><image :src="pre_url + '/static/img/feiji.png'"></image></view> |
|||
<view class="f2"> |
|||
<view class="t1">快递公司:<text style="color:#333">{{express_com}}</text></view> |
|||
<view class="t2">快递单号:<text style="color:#333">{{express_no}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="content"> |
|||
<view v-for="(item, index) in datalist" :key="index" :class="'item ' + (index==0?'on':'')"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/img/dot' + (index==0?'2':'1') + '.png'"></image></view> |
|||
<view class="f2"> |
|||
<text class="t2">{{item.time}}</text> |
|||
<text class="t1">{{item.context}}</text> |
|||
</view> |
|||
</view> |
|||
<nodata v-if="nodata" text="暂未查找到物流信息"></nodata> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<view class="tobuy flex-x-center flex-y-center" @tap="goto" data-url="mail" :style="{background:t('color1')}" >我要寄件</view> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
nodata:false, |
|||
express_com: '', |
|||
express_no: '', |
|||
datalist: [], |
|||
|
|||
orderinfo: {}, |
|||
prolist: [], |
|||
binfo: {}, |
|||
psuser: {}, |
|||
psorder: {}, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.express_com = that.opt.com; |
|||
that.express_no = that.opt.num; |
|||
that.loading = true; |
|||
app.post('ApiExpress/logistics', {com: that.express_com,num: that.express_no}, function (res) { |
|||
that.loading = false; |
|||
var datalist = res.datalist.data; |
|||
if (datalist.length < 1) { |
|||
that.nodata = true; |
|||
} |
|||
that.express_com = res.com |
|||
that.datalist = datalist; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
call:function(e){ |
|||
var tel = e.currentTarget.dataset.tel; |
|||
uni.makePhoneCall({ |
|||
phoneNumber: tel |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.expressinfo{} |
|||
.expressinfo .head { width:100%;background: #fff; margin:20rpx 0;padding: 20rpx 20rpx;display:flex;align-items:center} |
|||
.expressinfo .head .f1{ width:120rpx;height:120rpx;margin-right:20rpx} |
|||
.expressinfo .head .f1 image{width:100%;height:100%} |
|||
.expressinfo .head .f2{display:flex;flex-direction:column;flex:auto;font-size:30rpx;color:#999999} |
|||
.expressinfo .head .f2 .t1{margin-bottom:8rpx} |
|||
.expressinfo .content{ width: 100%; background: #fff;display:flex;flex-direction:column;color: #979797;padding:20rpx 40rpx; padding-bottom: 100rpx;;} |
|||
.expressinfo .content .on{color: #23aa5e;} |
|||
.expressinfo .content .item{display:flex;width: 96%; margin: 0 2%;border-left: 1px #dadada solid;padding:10rpx 0} |
|||
.expressinfo .content .item .f1{ width:40rpx;flex-shrink:0;position:relative} |
|||
.expressinfo .content image{width: 30rpx; height: 30rpx; position: absolute; left: -16rpx; top: 22rpx;} |
|||
/*.content .on image{ top:-1rpx}*/ |
|||
.expressinfo .content .item .f1 image{ width: 30rpx; height: 30rpx;} |
|||
|
|||
.expressinfo .content .item .f2{display:flex;flex-direction:column;flex:auto;} |
|||
.expressinfo .content .item .f2 .t1{font-size: 30rpx;} |
|||
.expressinfo .content .item .f2 .t1{font-size: 26rpx;} |
|||
|
|||
|
|||
.map{width:100%;height:500rpx;overflow:hidden} |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.order-box{ width: 94%;margin:20rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f5f5f5 solid; height:88rpx; line-height:88rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#222222} |
|||
.order-box .head .f1 .img{width:24rpx;height:24rpx;margin-right:4px} |
|||
.order-box .head .f1 .t1{color:#06A051;margin-right:10rpx} |
|||
.order-box .head .f2{color:#FF6F30} |
|||
.order-box .head .f2 .t1{font-size:36rpx;margin-right:4rpx} |
|||
|
|||
.order-box .content{display:flex;justify-content:space-between;width: 100%; padding:16rpx 0px;border-bottom: 1px solid #f5f5f5;position:relative} |
|||
.order-box .content .f1{width:100rpx;display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t1 .x2{color:#999999;font-size:24rpx;margin-bottom:8rpx} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx} |
|||
|
|||
.order-box .content .f1 .t3{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t3 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t3 .x2{color:#999999;font-size:24rpx} |
|||
.order-box .content .f2{} |
|||
.order-box .content .f2 .t1{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-bottom:6rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f2 .t2{font-size:24rpx;color:#222222;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f2 .t3{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-top:30rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.order-box .content .f3 .img{width:72rpx;height:168rpx} |
|||
|
|||
.orderinfo{width: 94%;margin:20rpx 3%;margin-top:10rpx;padding: 14rpx 3%;background: #FFF;border-radius:8px} |
|||
.orderinfo .box-title{color:#161616;font-size:30rpx;height:80rpx;line-height:80rpx;font-weight:bold} |
|||
.orderinfo .item{display:flex;width:100%;padding:10rpx 0;} |
|||
.orderinfo .item .t1{width:200rpx;color:#161616} |
|||
.orderinfo .item .t2{flex:1;text-align:right;color:#222222} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;background: #fff; position: fixed; bottom: 0px;left: 0px;display:flex;align-items:center;height:100rpx;} |
|||
.bottom .f1{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55;border-right:1px solid #EAEEED} |
|||
.bottom .f1 .img{width:44rpx;height:44rpx} |
|||
.bottom .f2{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55} |
|||
.bottom .f2 .img{width:44rpx;height:44rpx} |
|||
.bottom .btn1{flex:1;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%);height:100rpx;line-height:100rpx;color:#fff;text-align:center;font-size:32rpx} |
|||
.tobuy{width: 80%; margin: auto; line-height: 72rpx;color: #fff; border-radius:40rpx; |
|||
background-color: #007AFF; border: none;font-size:28rpx;font-weight:bold; height: 80rpx; position: fixed; left:10%; bottom: 0;} |
|||
|
|||
</style> |
|||
@ -0,0 +1,358 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block> |
|||
<form @submit="formSubmit"> |
|||
<view class="content1" > |
|||
<view class="top flex" > |
|||
<view class="f1"> |
|||
<image :src="event_rul + '/static/img/static/img/exp_ji.png'"></image> |
|||
</view> |
|||
<view class="f2" v-if="address.id" @tap="goto" data-url="address?fromPage=mail&mailtype=1"> |
|||
<view class="t1">{{address.name}} {{address.tel}}</view> |
|||
<view class="t2">{{address.area}} {{address.address}} </view> |
|||
</view> |
|||
<view class="f2" v-else @tap="goto" data-url="addressadd?fromPage=mail&mailtype=1"> |
|||
<view class="t1">寄件人信息</view> |
|||
<view class="t2">点击填写寄件地址,自动智能填写 </view> |
|||
</view> |
|||
<view class="f3" @tap="goto" data-url="address?fromPage=mail&mailtype=1" > |
|||
<view><image :src="event_rul + '/static/img/static/img/exp_txl.png'"></image></view> |
|||
<view class="t3" >地址薄</view> |
|||
</view> |
|||
</view> |
|||
<view class="top2 flex"> |
|||
<view class="f1"> |
|||
<image :src="event_rul + '/static/img/static/img/exp_shou.png'"></image> |
|||
</view> |
|||
<view class="f2" v-if="address2.id" @tap="goto" data-url="address?fromPage=mail&mailtype=2"> |
|||
<view class="t1">{{address2.name}} {{address2.tel}}</view> |
|||
<view class="t2">{{address2.area}} {{address2.address}} </view> |
|||
</view> |
|||
<view class="f2" v-else @tap="goto" data-url="addressadd?fromPage=mail&mailtype=2"> |
|||
<view class="t1">收件人信息</view> |
|||
<view class="t2">复制完整信息,自动智能填写</view> |
|||
</view> |
|||
<view class="f3" @tap="goto" data-url="address?fromPage=mail&mailtype=2"> |
|||
<view><image :src="event_rul + '/static/img/static/img/exp_txl.png'"></image></view> |
|||
<view class="t3" >地址薄</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">物品信息</text> |
|||
<input class="input" type="text" placeholder="请输入物品信息" placeholder-style="font-size:28rpx;color:#BBBBBB" name="cargo" ></input> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">预估重量</text> |
|||
<view class="addnum"> |
|||
<view class="minus"><image class="img" :src="event_rul + '/static/img/static/img/cart-minus.png'" @tap="minus" /></view> |
|||
<input class="input" type="number" :value="this.weight"></input>KG |
|||
<view class="plus"><image class="img" :src="event_rul + '/static/img/static/img/cart-plus.png'" @tap="plus" /></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">选择配送公司</text> |
|||
<picker v-if="expressdata" @change="expresschange" :value="express_index" :range="expressdata" style="font-size:28rpx;padding:10rpx;height:70rpx;border-radius:4px;flex:1"> |
|||
<view class="picker" style="height:70rpx;" @tap="changeyl">{{expressdata[express_index]?expressdata[express_index]:'请选择配送公司'}}</view> |
|||
</picker> |
|||
<view v-else class="picker" style="height:70rpx;" @tap="changeyl">{{expressdata[express_index]?expressdata[express_index]:'请选择配送公司'}}</view> |
|||
<image :src="event_rul + '/static/img/static/img/arrowright.png'" class="icon"> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">期望上门时间</text> |
|||
<view class="input" @tap="choosePstime" :data-bid="0"> |
|||
{{pstimetext==''?'请选择上门时间':pstimetext}} |
|||
</view> |
|||
<image :src="event_rul + '/static/img/static/img/arrowright.png'" class="icon"> |
|||
</view> |
|||
|
|||
|
|||
<view class="form-item"> |
|||
<text class="label">给快递员留言</text> |
|||
<input class="input" type="text" placeholder="选填" placeholder-style="font-size:28rpx;color:#BBBBBB" name="remark" ></input> |
|||
</view> |
|||
|
|||
</view> |
|||
<view v-if="showxieyi" class="xieyibox"> |
|||
<view class="xieyibox-content"> |
|||
<view style="overflow:scroll;height:100%;"> |
|||
<parse @navigate="navigate"></parse> |
|||
</view> |
|||
<view style="position:absolute;z-index:9999;bottom:10px;left:0;right:0;margin:0 auto;text-align:center; width: 50%;height: 60rpx; line-height: 60rpx; color: #fff; border-radius: 8rpx;" @tap="hidexieyi">已阅读并同意</view> |
|||
</view> |
|||
</view> |
|||
<view class="bottom flex"> |
|||
<view class="left"> |
|||
<view> |
|||
<text class="t1" v-if="price">¥{{price}}</text> |
|||
<text class="t1" v-else>¥--</text> |
|||
<text class="t2">预估运费</text> |
|||
</view> |
|||
<view class="t3">注:费用以实际寄件为准</view> |
|||
</view> |
|||
<view> |
|||
<button class="tobuy" :style="{background:t('color1')}" form-type="submit" >下单</button> |
|||
</view> |
|||
</view> |
|||
</form> |
|||
</block> |
|||
|
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text |
|||
class="popup__title-text">请选择上门时间</text> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" |
|||
@tap.stop="hidePstimeDialog" /> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" |
|||
v-for="(item, index) in pstimeArr" |
|||
:key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" |
|||
:style="sm_time==item.value ? 'background:'+t('color1')+';border:0' : ''"> |
|||
<image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
platform:'', |
|||
platformname:'', |
|||
platformimg:'weixin', |
|||
showxieyi:false, |
|||
isagree:false, |
|||
smsdjs: '', |
|||
tel:'', |
|||
hqing: 0, |
|||
frompage:'/pages/express/mail', |
|||
address: [], |
|||
expressdata:[], |
|||
express_index:-1, |
|||
express_no:'', |
|||
pstimeDialogShow: false, |
|||
pstimetext:'', |
|||
sm_time:'', |
|||
address2:[], |
|||
weight:1, |
|||
price:0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
app.get('ApiExpress/getAddress', {}, function(res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
if (res.msg) { |
|||
app.alert(res.msg) |
|||
} |
|||
} |
|||
//that.expressdata = res.data.expressdata; |
|||
that.address = res.data.address; |
|||
that.address2 = res.data.address2; |
|||
that.addressid =that.address.id |
|||
that.address2id =that.address2.id |
|||
that.pstimeArr = res.data.pstimeArr; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
regionchange(e) { |
|||
const value = e.detail.value |
|||
console.log(value[0].text + ',' + value[1].text + ',' + value[2].text); |
|||
this.regiondata = value[0].text + ',' + value[1].text + ',' + value[2].text |
|||
}, |
|||
expresschange:function(e){ |
|||
var that=this |
|||
that.express_index = e.detail.value; |
|||
|
|||
this.getprice() |
|||
}, |
|||
changeyl:function(e){ |
|||
var that=this |
|||
if(!that.address2id){ |
|||
app.alert('请填写寄件地址');return; |
|||
} |
|||
app.get('ApiExpress/getYunli', { addressid:that.address2id}, function(res) { |
|||
if (res.status == 1) { |
|||
that.expressdata = res.data |
|||
} else { |
|||
app.error(res.msg);return; |
|||
} |
|||
}) |
|||
|
|||
}, |
|||
getprice:function(e){ |
|||
var that = this; |
|||
var company = that.expressdata[that.express_index]; |
|||
var weight = that.weight; |
|||
var addressid = that.addressid; |
|||
var address2id = that.address2id; |
|||
app.post('ApiExpress/getPrice', {addressid: addressid,address2id: address2id,company:company,weight:weight |
|||
}, function (res) { |
|||
if (res.status == 1) { |
|||
that.price = res.data.combos[0].price |
|||
} else { |
|||
that.price =''; |
|||
} |
|||
}); |
|||
}, |
|||
choosePstime: function(e) { |
|||
var that = this; |
|||
var bid = e.currentTarget.dataset.bid; |
|||
var pstimeArr = that.pstimeArr; |
|||
var itemlist = []; |
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选时间段'); |
|||
return; |
|||
} |
|||
that.nowbid = bid; |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
}, |
|||
pstimeRadioChange: function(e) { |
|||
var that = this; |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var choosepstime = that.pstimeArr[pstimeIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.sm_time = choosepstime.value; |
|||
that.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function() { |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var formdata = e.detail.value; |
|||
var addressId = that.opt.id || ''; |
|||
var cargo = formdata.cargo; |
|||
var company = that.expressdata[that.express_index]; |
|||
var sm_time = that.sm_time; |
|||
var addressid = that.addressid; |
|||
var address2id = that.address2id; |
|||
if(!addressid){ |
|||
app.error('请添加寄件地址'); |
|||
return; |
|||
} |
|||
if(!address2id){ |
|||
app.error('请添加收件地址'); |
|||
return; |
|||
} |
|||
if (company == '' ) { |
|||
app.error('请先择配送公司'); |
|||
return; |
|||
} |
|||
if (sm_time == '' ) { |
|||
app.error('请先择上门时间'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiExpress/createOrder', {type: that.type,addressid: addressid,address2id: address2id,cargo:cargo,company:company, |
|||
sm_time:sm_time,remark:formdata.remark,weight:that.weight}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
app.success('寄件成功'); |
|||
setTimeout(function () { |
|||
//app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
}, |
|||
|
|||
bindPickerChange: function (e) { |
|||
var val = e.detail.value; |
|||
this.regiondata = val; |
|||
}, |
|||
setaddressxx: function (e) { |
|||
this.addressxx = e.detail.value; |
|||
}, |
|||
//减 |
|||
minus: function (e) { |
|||
var num = this.weight; |
|||
if(num>1){ |
|||
this.weight = num-1; |
|||
} |
|||
this.getprice() |
|||
}, |
|||
//加 |
|||
plus: function (e) { |
|||
var num = this.weight; |
|||
this.weight = num+1; |
|||
this.getprice() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.content1{ background: #fff; margin: 30rpx; padding: 30rpx; border-radius: 12rpx;} |
|||
.content1 .top2{ margin-top: 20px;border-top:1px solid #eee; padding-top: 30rpx;} |
|||
.content1 .f1{ height: 130rpx; display: flex; align-items: center; margin-right:20rpx} |
|||
.content1 .f1 image{ width: 48rpx; height: 48rpx;line-height: 100rpx;} |
|||
.content1 .f2{ border-right:1px solid #eee; width:80%;} |
|||
.content1 .f2 .t1{ color: #222; font-size: 32rpx; font-weight: bold;} |
|||
.content1 .f2 .t2{ color: #909090; font-size: 24rpx; line-height: 40rpx; margin-top: 20rpx; } |
|||
.content1 .f3{ width:180rpx; text-align: center; margin-top: 30rpx; } |
|||
.content1 .f3 image{ width: 32rpx; height: 32rpx; } |
|||
.content1 .f3 .t3{ text-align: center;} |
|||
|
|||
.form{ width:94%;margin:20rpx 3%;border-radius:5px;padding: 0 3%;background: #FFF;} |
|||
.form .form-item{display:flex;width:100%;height:98rpx;justify-content: space-between;} |
|||
.form-item:last-child{border:0} |
|||
.form-item .label{ color:#222;font-weight:bold;height: 60rpx; line-height: 60rpx; text-align:left;width:200rpx;padding-right:20rpx} |
|||
.form-item .input{ flex:1;height: 60rpx; line-height: 60rpx;text-align:right}.xieyibox{width:100%;height:100%;position:fixed;top:0;left:0;z-index:99;background:rgba(0,0,0,0.7)} |
|||
.xieyibox-content{width:90%;margin:0 auto;height:80%;margin-top:20%;background:#fff;color:#333;padding:5px 10px 50px 10px;position:relative;border-radius:2px} |
|||
|
|||
.bottom{ position: fixed; bottom: 0; background: #fff; width: 100%; padding: 30rpx; justify-content: space-between;} |
|||
.bottom .left .t1{ color: #FD4A46; font-size: 40rpx; font-weight: bold; } |
|||
.bottom .left .t2{ color: #BBB; font-size: 24rpx; margin-left: 20rpx;} |
|||
.bottom .left .t3{ color: #BBB; font-size: 20rpx; } |
|||
.bottom .tobuy{width:240rpx ; line-height: 72rpx;color: #fff; border-radius:40rpx; |
|||
background-color: #007AFF; border: none;font-size:28rpx;font-weight:bold; height: 80rpx; } |
|||
|
|||
.form-item .icon{ width:32rpx; height: 32rpx; margin-top: 20rpx; } |
|||
.picker{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;text-align: right; line-height: 50rpx;} |
|||
|
|||
.pstime-item {display: flex;border-bottom: 1px solid #f5f5f5;padding: 20rpx 30rpx;} |
|||
.pstime-item .radio {flex-shrink: 0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right: 30rpx} |
|||
.pstime-item .radio .radio-img {width: 100%;height: 100%} |
|||
.addnum {font-size: 30rpx;color: #666;width:auto;display:flex;} |
|||
.form-item .addnum input{ width: 80rpx; text-align: center; margin-top: -10rpx;} |
|||
.addnum .plus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.addnum .minus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.addnum .img{width:24rpx;height:24rpx} |
|||
.addnum .i {padding: 0 20rpx;color:#2B2B2B;font-weight:bold;font-size:24rpx} |
|||
</style> |
|||
@ -0,0 +1,394 @@ |
|||
<template> |
|||
<view class="container" style="background:#c40004"> |
|||
<block v-if="isload"> |
|||
<view class="wrap"> |
|||
<view class="header clearfix"> |
|||
<view class="rule" @tap="changemaskrule">活动规则</view> |
|||
<view @tap="goto" :data-url="'myprize?hid=' + info.id" class="my">我的奖品</view> |
|||
</view> |
|||
<view class="title" :style="'background-image:url(' + info.banner + ');background-size:100% 100%;'"></view> |
|||
|
|||
<view class="scratch-bg"> |
|||
<view style="position:relative"> |
|||
<image class="scratch-bg-1" :src="event_rul + '/static/img/static/img/scratch_bg.png'"></image> |
|||
<image class="scratch-bg-2" id="frame" :src="event_rul + '/static/img/static/img/scratch_kuang.png'"></image> |
|||
<view class="scratch-award"> |
|||
<view class="scratch-award-a"> |
|||
<block v-if="isStart && !showmaskrule && !jxshow"><canvas @touchend="touchEnd" @touchmove="touchMove" @touchstart="touchStart" canvasId="scratch" class="scratch-canvas" :disableScroll="isScroll" id="scratch" style="position:absolute;left:0;z-index:888"></canvas></block> |
|||
<view class="scratch-bg-text"> |
|||
<block v-if="award_name"><text class="scratch-text-1">{{jxmc||'刮开图层'}}</text></block> |
|||
<block v-if="(remaindaytimes > 0 && award_name)"> |
|||
<view @tap="onStart" class="scratch-bg-text-2">再刮一次</view> |
|||
</block> |
|||
<block v-if="(remaindaytimes <= 0 && award_name)"> |
|||
<view class="scratch-bg-text-3">再刮一次</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="border" v-if="info.use_type != 2">您今日还有 <text id="change">{{remaindaytimes}}</text> 次抽奖机会</view> |
|||
<view class="border2" v-if="info.use_type == 1 && info.usescore>0">每次抽奖将消耗 <text>{{info.usescore}}</text> {{t('积分')}},您共有 <text id="myscore">{{member.score}}</text> {{t('积分')}}</view> |
|||
<view class="border2" v-if="info.use_type == 2 && info.usemoney>0">每次抽奖将消耗 <text>{{t('余额')}}</text>{{info.usemoney}}元 ,您共有 <text id="mymoney">{{member.money}}</text> 元</view> |
|||
<!--滚动信息--> |
|||
<view class="scroll"> |
|||
<view class="p" :style="'background-image:url('+pre_url+'/static/img/dzp/list.png);background-size:100% 100%;'"></view> |
|||
<view class="sideBox"> |
|||
<swiper class="bd" autoplay="true" indicator-dots="false" current="0" vertical="true"> |
|||
<swiper-item v-for="(item, index) in zjlist" :key="index" class="sitem" v-if="index%2==0"> |
|||
<view>恭喜{{item.nickname}} 获得<text class="info">{{item.jxmc}}</text></view> |
|||
<view v-if="zjlist[index+1]">恭喜{{zjlist[index+1].nickname}} 获得<text class="info">{{zjlist[index+1].jxmc}}</text></view> |
|||
</swiper-item> |
|||
</swiper> |
|||
</view> |
|||
</view> |
|||
|
|||
<view id="mask-rule" v-if="showmaskrule"> |
|||
<view class="box-rule"> |
|||
<view class="h2">活动规则说明</view> |
|||
<view id="close-rule" @tap="changemaskrule" :style="'background-image:url('+pre_url+'/static/img/dzp/close.png);background-size:100%'"></view> |
|||
<view class="con"> |
|||
<view class="text"> |
|||
<text decode="true" space="true">{{info.guize}}</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var dot_inter, bool; |
|||
var interval; |
|||
var app = getApp(); |
|||
var windowWidth = uni.getSystemInfoSync().windowWidth; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
isStart: 1, |
|||
name: "", |
|||
jxmc: "", |
|||
detect: 1, |
|||
error: "", |
|||
info:{}, |
|||
member:{}, |
|||
jxarr:[], |
|||
remaindaytimes: 0, |
|||
remaintimes:0, |
|||
zjlist:[], |
|||
register: 1, |
|||
award_name: 0, |
|||
jxshow: false, |
|||
showmaskrule: false, |
|||
latitude: "", |
|||
longitude: "", |
|||
r: 0, |
|||
lastX: "", |
|||
lastY: "", |
|||
minX: "", |
|||
minY: "", |
|||
maxX: "", |
|||
maxY: "", |
|||
canvasWidth: "", |
|||
canvasHeight: "", |
|||
isScroll: false, |
|||
award: 0, |
|||
jx: "", |
|||
windowWidth:0, |
|||
windowHeight:0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad:function(opt){ |
|||
this.opt = app.getopts(opt); |
|||
}, |
|||
onReady: function () { |
|||
var that = this; |
|||
var res = uni.getSystemInfoSync(); |
|||
that.windowWidth = res.windowWidth; |
|||
that.windowHeight = res.windowHeight; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage: function () { |
|||
var that = this; |
|||
var title = that.info.name; |
|||
if (that.info.sharetitle) title = that.info.sharetitle; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : ''; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
return this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic,callback:function(){that.sharecallback();}}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var that = this; |
|||
var title = that.info.name; |
|||
if (that.info.sharetitle) title = that.info.sharetitle; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : ''; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
var sharewxdata = this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic,callback:function(){that.sharecallback();}}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
getdata: function () { |
|||
var that = this; |
|||
var id = that.opt.id; |
|||
that.loading = true; |
|||
app.get('ApiChoujiang/index', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if(res.status == 0){ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.info = res.info; |
|||
that.jxarr = res.jxarr; |
|||
that.member = res.member; |
|||
that.remaindaytimes = res.remaindaytimes; |
|||
that.remaintimes = res.remaintimes; |
|||
that.zjlist = res.zjlist; |
|||
uni.setNavigationBarTitle({ |
|||
title: res.info.name |
|||
}); |
|||
that.onStart(); |
|||
if (that.info.fanwei == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
that.latitude = latitude; |
|||
that.longitude = longitude; |
|||
}); |
|||
} |
|||
var title = that.info.name; |
|||
if (that.info.sharetitle) title = that.info.sharetitle; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : ''; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
that.loaded({title:title,desc:sharedesc,link:sharelink,pic:sharepic,callback:function(){that.sharecallback();}}); |
|||
}); |
|||
}, |
|||
sharecallback:function(){ |
|||
var that = this; |
|||
app.post("ApiChoujiang/share", {hid: that.info.id}, function (res) { |
|||
if (res.status == 1) { |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
} else if (res.status == 0) {//dialog(res.msg); |
|||
} |
|||
}); |
|||
}, |
|||
changemaskrule: function () { |
|||
this.showmaskrule = !this.showmaskrule; |
|||
}, |
|||
init: function () { |
|||
var windowWidth = this.windowWidth; |
|||
var windowHeight = this.windowHeight; |
|||
//var query = uni.createSelectorQuery(); |
|||
var that = this; |
|||
that.award_name = 0; |
|||
//query.select("#frame").boundingClientRect(); |
|||
//query.exec(function (res) { |
|||
// console.log(res) |
|||
//var width = res[0].width; |
|||
//var height = res[0].height; |
|||
var width = windowWidth/750*600; |
|||
var height = windowWidth/750*320; |
|||
console.log(height) |
|||
that.r = 16; |
|||
that.lastX = ""; |
|||
that.lastY = ""; |
|||
that.minX = ""; |
|||
that.minY = ""; |
|||
that.maxX = ""; |
|||
that.maxY = ""; |
|||
that.canvasWidth = width; |
|||
that.canvasHeight = height; |
|||
var scratch = uni.createCanvasContext("scratch"); |
|||
scratch.setFillStyle('#D3D3D3'); |
|||
scratch.fillRect(0, 0, width, height); |
|||
scratch.draw(); |
|||
console.log(scratch); |
|||
|
|||
//scratch.drawImage("https://dev.lansoft.shop/static/img/static/img/scratch_hide_2.png", 0, 0, width, height); |
|||
//scratch.draw(); |
|||
that.ctx = scratch; |
|||
that.isStart = 1; |
|||
that.isScroll = true; |
|||
//}); |
|||
}, |
|||
onStart: function () { |
|||
this.jxmc = ''; |
|||
this.isStart = 1; |
|||
this.award = 0; |
|||
this.award_name = 0; |
|||
var that = this |
|||
setTimeout(function(){ |
|||
that.init(); |
|||
},100) |
|||
}, |
|||
drawRect: function (t, e) { |
|||
var a = this.r / 2; |
|||
var i = 0 < t - a ? t - a : 0; |
|||
var s = 0 < e - a ? e - a : 0; |
|||
if("" !== this.minX){ |
|||
this.minX = this.minX > i ? i : this.minX; |
|||
this.minY = this.minY > s ? s : this.minY; |
|||
this.maxX = this.maxX > i ? this.maxX : i; |
|||
this.maxY = this.maxY > s ? this.maxY : s; |
|||
}else{ |
|||
this.minX = i; |
|||
this.minY = s; |
|||
this.maxX = i; |
|||
this.maxY = s; |
|||
} |
|||
this.lastX = i; |
|||
this.lastY = s; |
|||
[i, s, 2 * a]; |
|||
}, |
|||
clearArc: function (x, y, a) { |
|||
var r = this.r; |
|||
var ctx = this.ctx; |
|||
var x2 = r - a; |
|||
var y2 = Math.sqrt(r * r - x2 * x2); |
|||
var c = x - x2; |
|||
var n = y - y2; |
|||
var d = 2 * x2; |
|||
var p = 2 * y2; |
|||
|
|||
if (a <= r) { |
|||
ctx.clearRect(c, n, d, p); |
|||
a += 1; |
|||
this.clearArc(x, y, a); |
|||
} |
|||
}, |
|||
touchStart: function (t) { |
|||
this.award_name = 1 |
|||
if (this.isStart && this.error) { |
|||
app.alert(this.error); |
|||
} |
|||
}, |
|||
touchMove: function (t) { |
|||
if (this.isStart && !this.error) { |
|||
this.drawRect(t.touches[0].x, t.touches[0].y); |
|||
this.clearArc(t.touches[0].x, t.touches[0].y, 1); |
|||
this.ctx.draw(true); |
|||
} |
|||
}, |
|||
touchEnd: function (t) { |
|||
if (this.isStart && !this.error) { |
|||
var that = this; |
|||
var canvasWidth = this.canvasWidth; |
|||
var canvasHeight = this.canvasHeight; |
|||
var minX = this.minX; |
|||
var minY = this.minY; |
|||
var maxX = this.maxX; |
|||
var maxY = this.maxY; |
|||
|
|||
if (0.4 * canvasWidth < maxX - minX && 0.4 * canvasHeight < maxY - minY && this.detect) { |
|||
that.detect = 0; |
|||
app.post('ApiChoujiang/index', {id: that.info.id,op: 'getjx',longitude: that.longitude,latitude: that.latitude}, function (res) { |
|||
if (res.status != 1) { |
|||
app.alert(res.msg); |
|||
that.onStart(); |
|||
} else { |
|||
that.jxmc = res.jxmc; |
|||
that.jx = res.jx; |
|||
that.remaindaytimes = that.remaindaytimes - 1; |
|||
setTimeout(function () { |
|||
that.detect = 1; |
|||
that.isStart = 0; |
|||
that.isScroll = true; |
|||
}, 1000); |
|||
|
|||
if (res.jxtp == 2 && res.spdata) { |
|||
uni.sendBizRedPacket({ |
|||
timeStamp: res.spdata.timeStamp, |
|||
// 支付签名时间戳, |
|||
nonceStr: res.spdata.nonceStr, |
|||
// 支付签名随机串,不长于 32 位 |
|||
package: res.spdata.package, |
|||
//扩展字段,由商户传入 |
|||
signType: res.spdata.signType, |
|||
// 签名方式, |
|||
paySign: res.spdata.paySign, |
|||
// 支付签名 |
|||
success: function (res) { |
|||
console.log(res); |
|||
}, |
|||
fail: function (res) { |
|||
console.log(res); |
|||
}, |
|||
complete: function (res) { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.scratch-center{ position:relative; padding-top:380rpx; } |
|||
.scratch-bg{ padding-top:30rpx;text-align:center;margin-bottom:80rpx} |
|||
.scratch-bg-1 { width:640rpx; height:360rpx; } |
|||
.scratch-bg-2 { position:absolute; top:20rpx; left:50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, 0); width:600rpx; height:320rpx; } |
|||
.scratch-bg-3 { position:absolute; top:150rpx; left:50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, 0); line-height:80rpx; background:#f05525; border-radius:40rpx; padding:0 48rpx; color:#ffffff; } |
|||
.scratch-award { position:absolute; top:20rpx; left:50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, 0); width:600rpx; height:320rpx; } |
|||
.scratch-canvas { z-index:999; width:600rpx; height:320rpx; } |
|||
.scratch-award-a { position:relative; top:0; left:0; width:600rpx; height:320rpx; } |
|||
.scratch-bg-text { position:absolute; top:60rpx; left:50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, 0); } |
|||
.scratch-text-1 { font-size:18pt; color:#f05525; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; width:410rpx; } |
|||
.scratch-bg-text-2 { width:400rpx; line-height:80rpx; color:#ffffff; margin-top:40rpx; border-radius:40rpx; background:#f05525; } |
|||
.scratch-bg-text-3{ width:400rpx; line-height:80rpx; color:#ffffff; margin-top:40rpx; border-radius:40rpx; background:#cdcdcd; } |
|||
|
|||
.wrap {width:100%;height:100%;} |
|||
.header{width:100%;padding:22rpx 37rpx 0 37rpx;display:flex;justify-content:space-between} |
|||
.rule,.my{width:140rpx;height:60rpx;border: 1px solid #f58d40;font-size:30rpx;line-height:60rpx;text-align: center;color: #f58d40;border-radius:5rpx;} |
|||
.title {width:640rpx;height:316rpx;margin: auto;margin-top:-60rpx;} |
|||
|
|||
/*次数*/ |
|||
.border {width: 380rpx;height:64rpx;margin: 0 auto 25rpx;background:#fb3a13;font-size:24rpx;line-height:64rpx;text-align: center;color: #fff;border-radius:45rpx} |
|||
.border2 {width:600rpx;height:50rpx;margin: 0 auto;background:#dbaa83;font-size:24rpx;line-height:50rpx;text-align: center;color: #fff;border-radius:10rpx} |
|||
.scroll {width:550rpx;height:185rpx;margin:75rpx auto 0 auto;} |
|||
.scroll .p {width: 372rpx;height:24rpx;margin: auto;} |
|||
.sideBox{ width: 100%;height:100rpx;margin-top:20rpx;padding: 10rpx 0 10rpx 0;background-color: rgba(255, 255, 255, 0.2);border-radius:10rpx;overflow:hidden;} |
|||
.sideBox .bd {width: 100%;height:80rpx;overflow:hidden;} |
|||
.sideBox .sitem{overflow:hidden;text-align: center;font-size:20rpx;line-height:40rpx;color: #fff;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;} |
|||
|
|||
/*规则弹窗*/ |
|||
#mask-rule,#mask {position: fixed;left: 0;top: 0;z-index: 999;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.85);} |
|||
#mask-rule .box-rule {position: relative;margin: 30% auto;padding-top: 40rpx;width: 90%;height: 675rpx;border-radius: 20rpx;background-color: #f58d40;} |
|||
#mask-rule .box-rule .star {position: absolute;left: 50%;top: -100rpx;margin-left: -130rpx;width: 259rpx;height:87rpx;} |
|||
#mask-rule .box-rule .h2 {width: 100%;text-align: center;line-height: 34rpx;font-size: 34rpx;font-weight: normal;color: #fff;} |
|||
#mask-rule #close-rule {position: absolute;right: 34rpx;top: 38rpx;width: 40rpx;height: 40rpx;} |
|||
/*内容盒子*/ |
|||
#mask-rule .con {overflow: auto;position: relative;margin: 40rpx auto;padding-right: 15rpx;width: 580rpx;height: 82%;line-height: 48rpx;font-size: 26rpx;color: #fff;} |
|||
#mask-rule .con .text {position: absolute;top: 0;left: 0;width: inherit;height: auto;} |
|||
|
|||
</style> |
|||
@ -0,0 +1,260 @@ |
|||
<template> |
|||
<view class="container" style="background-color:#c40004;min-height:100vh"> |
|||
<block v-if="isload"> |
|||
<view class="banner"><image :src="info.banner" mode="widthFix"></image></view> |
|||
<view class="activity"> |
|||
<view class="activity-amin"> |
|||
<view class="h2">我的奖品</view> |
|||
<view class="tb0"> |
|||
<view class="tr"> |
|||
<view class="td">中奖时间 </view> |
|||
<view class="td">中奖奖品</view> |
|||
<view class="td">领奖状态</view> |
|||
<view class="td">操作</view> |
|||
</view> |
|||
<view v-for="(item, index) in datalist" :key="index" class="tr"> |
|||
<view class="td td2">{{item.createtime}}</view> |
|||
<view class="td td2">{{item.jxmc}}</view> |
|||
<view class="td td2"><block v-if="item.status==0">未领奖</block><block v-else>已领奖</block></view> |
|||
<view class="td td2"> |
|||
<text v-if="item.status==0" @tap="duijiang" :data-k="index" :data-id="item.id" style="background-color:#fb5a43;padding:4rpx 8rpx">兑奖</text> |
|||
<text v-if="item.jxtp==3 && item.status==1" @tap="goto" data-url="/pages/coupon/mycoupon" style="background-color:#fb6a43;padding:4rpx 8rpx">查看</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view v-if="datalist.length==0" style="width:100%;padding:40rpx 0;text-align:center;color:#f19132">暂无中奖记录~</view> |
|||
<view @tap="goback" class="goback">返回</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view id="mask-rule2" v-if="maskshow && formdata"> |
|||
<view class="box-rule" style="height:900rpx"> |
|||
<view class="h2">兑奖信息</view> |
|||
<view id="close-rule2" style="background: no-repeat center / contain;background-image: url({pre_url}}/static/img/dzp/close.png);" @tap="changemaskshow"></view> |
|||
<view class="con"> |
|||
<view class="text" style="text-align:center"> |
|||
<view id="linkinfo" style="text-align: left;margin-left:10%;"> |
|||
<view v-for="(item, index) in formdata" :key="index">{{index}}:{{item}}</view> |
|||
</view> |
|||
<image :src="record.hexiaoqr" style="width:80%" id="hexiaoqr" mode="widthFix"></image> |
|||
<view>请出示兑奖码给核销员进行兑奖</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view id="mask-rule1" v-if="maskshow && !formdata"> |
|||
<view class="box-rule" style="height:640rpx"> |
|||
<view class="h2">请填写兑奖信息</view> |
|||
<view id="close-rule1" :style="'background: no-repeat center / contain;background-image: url('+pre_url+'/static/img/dzp/close.png);'" @tap="changemaskshow"></view> |
|||
<view class="con"> |
|||
<form class @submit="formsub"> |
|||
<view class="pay-form" style="margin-top:0.18rem"> |
|||
<view v-for="(item, idx) in info.formcontent" :key="idx" class="item flex-y-center"> |
|||
<view class="f1">{{item.val1}}:</view> |
|||
<view class="f2 flex flex1"> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form' + idx" class="input" :placeholder="item.val2"></input> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form' + idx" class="textarea" :placeholder="item.val2"></textarea> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form' + idx"> |
|||
<label v-for="(item1, index) in item.val2" :key="index"> |
|||
<radio :value="item1"></radio>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form' + idx"> |
|||
<label v-for="(item1, index) in item.val2" :key="index"> |
|||
<checkbox :value="item1" class="xyy-zu"></checkbox>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='switch'"> |
|||
<switch class="xyy-zu" value="1" :name="'form' + idx"></switch> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker mode="selector" :name="'form' + idx" value class="xyy-pic" :range="item.val2" @change="_editorBindPickerChange" :data-idx="idx" data-tplindex="0"> |
|||
<view class="picker" v-if="item.val2[_editorFormdata[0][idx]]"> {{item.val2[_editorFormdata[0][idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker mode="time" :name="'form' + idx" value :start="item.val2[0]" :end="item.val2[1]" class="xyy-pic" :range="item.val2" @change="_editorBindPickerChange" :data-idx="idx" data-tplindex="0"> |
|||
<view class="picker" v-if="_editorFormdata[0][idx]">{{_editorFormdata[0][idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker mode="date" :name="'form' + idx" value :start="item.val2[0]" :end="item.val2[1]" class="xyy-pic" :range="item.val2" @change="_editorBindPickerChange" :data-idx="idx" data-tplindex="0"> |
|||
<view class="picker" v-if="_editorFormdata[0][idx]"> {{_editorFormdata[0][idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
</block> |
|||
<block v-if="item.key=='region'"> |
|||
<picker mode="region" :name="'form' + idx" value class="xyy-pic" @change="_editorBindPickerChange" :data-idx="idx" data-tplindex="0"> |
|||
<view class="picker" v-if="_editorFormdata[0][idx]"> {{_editorFormdata[0][idx]}}</view> |
|||
<view v-else>请选择省市区</view> |
|||
</picker> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view style="padding:0 40px 0 80px"> |
|||
<button class="subbtn" form-type="submit">确 定</button> |
|||
</view> |
|||
</view> |
|||
</form> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
st: 0, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
maskshow: false, |
|||
record: "", |
|||
info:{}, |
|||
formdata: "" |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiChoujiang/myprize', {hid: that.opt.hid}, function (res) { |
|||
that.loading = false; |
|||
res.info.formcontent = JSON.parse(res.info.formcontent); |
|||
that.info = res.info; |
|||
that.datalist = res.datalist; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
duijiang: function (e) { |
|||
var that = this; |
|||
var k = e.currentTarget.dataset.k; |
|||
var id = e.currentTarget.dataset.id; |
|||
var record = that.datalist[k]; |
|||
var formdata = JSON.parse(record.formdata); |
|||
console.log(formdata); |
|||
that.record = record; |
|||
that.formdata = formdata; |
|||
that.maskshow = true; |
|||
}, |
|||
changemaskshow: function () { |
|||
var that = this; |
|||
that.maskshow = !that.maskshow; |
|||
}, |
|||
formsub: function (e) { |
|||
var that = this; |
|||
console.log(e); |
|||
var subdata = e.detail.value; |
|||
var formcontent = that.info.formcontent; |
|||
var record = that.record; |
|||
var formdata = {}; |
|||
|
|||
for (var i = 0; i < formcontent.length; i++) { |
|||
//console.log(subdata['form' + i]); |
|||
if (formcontent[i].val3 == 1 && (subdata['form' + i] === '' || subdata['form' + i] === undefined || subdata['form' + i].length == 0)) { |
|||
app.alert(formcontent[i].val1 + ' 必填'); |
|||
return; |
|||
} |
|||
|
|||
if (formcontent[i].key == 'switch') { |
|||
if (subdata['form' + i] == false) { |
|||
subdata['form' + i] = '否'; |
|||
} else { |
|||
subdata['form' + i] = '是'; |
|||
} |
|||
} |
|||
|
|||
if (formcontent[i].key == 'selector') { |
|||
subdata['form' + i] = formcontent[i].val2[subdata['form' + i]]; |
|||
} |
|||
|
|||
var nowformdata = {}; |
|||
formdata[formcontent[i].val1] = subdata['form' + i]; |
|||
} |
|||
|
|||
console.log(formdata); |
|||
app.post("ApiChoujiang/subinfo/rid/" + record.id, {formcontent: formdata}, function (res) { |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
} else { |
|||
that.changemaskshow(); |
|||
app.success(res.msg); |
|||
that.getdata(); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.banner{ width:100%;padding:0 5%} |
|||
.banner image{ display:block;width:100%;} |
|||
.activity{padding:0 0 45rpx 0;margin-top:20rpx} |
|||
.activity-amin{width:94%; margin:0 auto;} |
|||
.activity-amin .h2{ margin:0 auto 30rpx auto;width:330rpx;height: 60rpx;background-color: #fc8209;text-align: center;line-height:60rpx;font-size: 30rpx;color: #ffffff;border-radius: 26rpx;letter-spacing:14rpx} |
|||
.wt1{display:block; border:none; background-color:#FFF; padding:22rpx 22rpx; border-radius:8rpx; font-size: 30rpx; margin-bottom:60rpx;width:100%} |
|||
.wt4{width:100%;background-color:#fb3a13; color:#FFF;font-size:30rpx;margin-top: 60rpx;} |
|||
.tb0{ width:100%; margin-bottom:6%;font-size:24rpx} |
|||
.tb0 .tr{width:100%;display:flex;border-bottom:1px solid #fff} |
|||
.tb0 .tr .td{width:20%;background-color:#f19132;line-height:80rpx;text-align:center; color:#fff886;} |
|||
.tb0 .tr .td:nth-child(1){width:32%; } |
|||
.tb0 .tr .td:nth-child(2){width:32%; } |
|||
.tb0 .tr .td:nth-child(3){width:18%; } |
|||
.tb0 .tr .td:nth-child(4){width:18%; } |
|||
.tb0 .tr .td2{padding:20rpx 0; text-align:center; color:#FFF; background-color:#f19c48} |
|||
.goback{display:block;color:#fff;background-color:#fb3a13;margin:20rpx auto 40rpx auto;width:90%;padding:20rpx 0;text-align:center;font-size:36rpx;border-radius:15rpx;} |
|||
|
|||
#mask-rule1{position: fixed;top: 0;z-index: 10;width: 100%;max-width:640px;height: 100%;background-color: rgba(0, 0, 0, 0.85);} |
|||
#mask-rule1 .box-rule {background-color: #f58d40;position: relative;margin: 30% auto;padding-top:40rpx;width: 90%;height:700rpx;border-radius:20rpx;} |
|||
#mask-rule1 .box-rule .h2{width: 100%;text-align: center;line-height:34rpx;font-size: 34rpx;font-weight: normal;color: #fff;} |
|||
#mask-rule1 #close-rule1{position: absolute;right:34rpx;top: 38rpx;width: 40rpx;height: 40rpx;} |
|||
#mask-rule1 .con {overflow: auto;position: relative;margin: 40rpx auto;padding-right: 15rpx;width:580rpx;height: 82%;line-height: 48rpx;font-size: 26rpx;color: #fff;} |
|||
#mask-rule1 .con .text {position: absolute;top: 0;left: 0;width: inherit;height: auto;} |
|||
|
|||
#mask-rule2{position: fixed;top: 0;z-index: 10;width: 100%;max-width:640px;height: 100%;background-color: rgba(0, 0, 0, 0.85);} |
|||
#mask-rule2 .box-rule {background-color: #f58d40;position: relative;margin: 30% auto;padding-top:40rpx;width: 90%;height:700rpx;border-radius:20rpx;} |
|||
#mask-rule2 .box-rule .h2{width: 100%;text-align: center;line-height:34rpx;font-size: 34rpx;font-weight: normal;color: #fff;} |
|||
#mask-rule2 #close-rule2{position: absolute;right:34rpx;top: 38rpx;width: 40rpx;height: 40rpx;} |
|||
#mask-rule2 .con {overflow: auto;position: relative;margin: 20rpx auto;padding-right: 15rpx;width:580rpx;height:90%;line-height: 48rpx;font-size: 26rpx;color: #fff;} |
|||
#mask-rule2 .con .text {position: absolute;top: 0;left: 0;width: inherit;height: auto;} |
|||
|
|||
.pay-form .item{width:100%;padding:0 0 10px 0;color:#fff;} |
|||
.pay-form .item:last-child{border-bottom:0} |
|||
.pay-form .item .f1{width:80px;text-align:right;padding-right:10px} |
|||
.pay-form .item .f2 input[type=text]{width:100%;height:35px;padding:2px 5px;border:1px solid #ddd;border-radius:2px} |
|||
.pay-form .item .f2 textarea{width:100%;height:60px;padding:2px 5px;border:1px solid #ddd;border-radius:2px} |
|||
.pay-form .item .f2 select{width:100%;height:35px;padding:2px 5px;border:1px solid #ddd;border-radius:2px} |
|||
.pay-form .item .f2 label{height:35px;line-height:35px;} |
|||
.subbtn{width:100%;background:#fb3a13;font-size: 30rpx;padding:0 22rpx;border-radius: 8rpx;color:#FFF;} |
|||
</style> |
|||
@ -0,0 +1,144 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="myscore" :style="{background:t('color1')}"> |
|||
<view class="f1">我的额度</view> |
|||
<view class="f2">{{hongbao_everyday_edu}}</view> |
|||
</view> |
|||
<view class="myscore" :style="{background:t('color1')}" v-if="scoreWithdraw"> |
|||
<view class="f1">允提{{t('积分')}}</view> |
|||
<view class="f2">{{myscore2}}<view class="btn-mini" @tap="goto" data-url="/pages/my/scoreWithdraw">提现</view></view> |
|||
</view> |
|||
<view class="content" id="datalist"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="item"> |
|||
<view class="f1"> |
|||
<text class="t1">{{item.remark}}</text> |
|||
<text class="t2">{{item.createtime}}</text> |
|||
</view> |
|||
<view class="f2"> |
|||
<block v-if="item.money>0"> |
|||
<text class="t1">+{{item.money}}</text> |
|||
</block> |
|||
<block v-else> |
|||
<text class="t2">{{item.money}}</text> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
st: 0, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
hongbao_everyday_edu: 0, |
|||
myscore2: 0, |
|||
nodata: false, |
|||
nomore: false, |
|||
scoreTransfer:false, |
|||
scoreWithdraw:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiHongbaoEveryday/eduLog', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.hongbao_everyday_edu = res.member.hongbao_everyday_edu; |
|||
that.myscore2 = res.score_withdraw; |
|||
that.scoreTransfer = res.scoreTransfer; |
|||
that.scoreWithdraw = res.scoreWithdraw; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (e) { |
|||
var st = e.currentTarget.dataset.st; |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.myscore{width:94%;margin:20rpx 3%;border-radius: 10rpx 56rpx 10rpx 10rpx;position:relative;display:flex;flex-direction:column;padding:70rpx 0} |
|||
.myscore .f1{margin:0 0 0 60rpx;color:rgba(255,255,255,0.8);font-size:24rpx;} |
|||
.myscore .f2{margin:20rpx 0 0 60rpx;color:#fff;font-size:64rpx;font-weight:bold; position: relative;} |
|||
|
|||
.content{ width:94%;margin:0 3%;} |
|||
.content .item{width:100%;margin:20rpx 0;background:#fff;border-radius:5px;padding:20rpx 20rpx;display:flex;align-items:center} |
|||
.content .item .f1{flex:1;display:flex;flex-direction:column} |
|||
.content .item .f1 .t1{color:#000000;font-size:30rpx;word-break:break-all;overflow:hidden;text-overflow:ellipsis;} |
|||
.content .item .f1 .t2{color:#666666} |
|||
.content .item .f1 .t3{color:#666666} |
|||
.content .item .f2{ flex:1;font-size:36rpx;text-align:right} |
|||
.content .item .f2 .t1{color:#03bc01} |
|||
.content .item .f2 .t2{color:#000000} |
|||
.content .item .f3{ flex:1;font-size:32rpx;text-align:right} |
|||
.content .item .f3 .t1{color:#03bc01} |
|||
.content .item .f3 .t2{color:#000000} |
|||
|
|||
.data-empty{background:#fff} |
|||
.btn-mini {right: 32rpx;top: 28rpx;width: 100rpx;height: 50rpx;text-align: center;border: 1px solid #e6e6e6;border-radius: 10rpx;color: #fff;font-size: 24rpx;font-weight: bold;display: inline-flex;align-items: center;justify-content: center;position: absolute;} |
|||
</style> |
|||
@ -0,0 +1,265 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="wrap" style=" height: 100%;" :style="{background:'linear-gradient(-90deg,'+t('color1')+' ,rgba('+t('color1rgb')+',0.8) 100%)'}"> |
|||
<view class="title" :style="'background-image:url(' + info.banner + ');background-size:100% 100%;'"></view> |
|||
|
|||
<view class="content"> |
|||
<view class="f1"> |
|||
<view class="font-big" v-if="!todayRecord">--</view> |
|||
<view class="font-big" v-if="todayRecord">{{todayRecord.money}}</view> |
|||
<view class="font-normal">今日补贴</view> |
|||
<view class="rule" @tap="changeRule" :style="{background:'linear-gradient(-90deg,rgba('+t('color1rgb')+',0.2) ,rgba('+t('color1rgb')+',0.2) 100%)',color:t('color2')}">活动规则</view> |
|||
</view> |
|||
<view class="flex"> |
|||
<view class="col-3"> |
|||
<view class="font-mid">{{data.total}}</view> |
|||
<view class="font-normal">补贴总额</view> |
|||
</view> |
|||
<view class="col-3"> |
|||
<view class="font-mid">{{data.todayNum}}</view> |
|||
<view class="font-normal">今日数量</view> |
|||
</view> |
|||
<view class="col-3"> |
|||
<view class="font-mid">{{data.todayLeftNum}}</view> |
|||
<view class="font-normal">今日剩余</view> |
|||
</view> |
|||
</view> |
|||
<view class="flex"> |
|||
<view class="card" @tap="goto" data-url="eduLog"> |
|||
<view class="font-mid">{{member.hongbao_everyday_edu}}</view> |
|||
<view class="font-normal">我的额度</view> |
|||
</view> |
|||
<view class="card" @tap="goto" data-url="log"> |
|||
<view class="font-mid">{{member.hongbao_count}}</view> |
|||
<view class="font-normal">补贴总数</view> |
|||
</view> |
|||
</view> |
|||
<view> |
|||
<button class="form-btn" v-if="!todayRecord" @tap="getHongbao" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">领今日额度</button> |
|||
<button class="form-btn" v-if="todayRecord" :style="{background:'#aaa'}">明日再来</button> |
|||
</view> |
|||
<view @tap="goto" data-url="log">补贴记录</view> |
|||
</view> |
|||
|
|||
<view class="prolist"> |
|||
<dp-product-item :data="tjdatalist" @addcart="addcart" :menuindex="menuindex"></dp-product-item> |
|||
</view> |
|||
|
|||
|
|||
<view id="mask-rule" v-if="showmaskrule"> |
|||
<view class="box-hongbao" v-if="showBoxhongbao" :style="{background:'url('+pre_url+'/static/img/hongbao_bg.png'+') no-repeat',backgroundSize:'contain'}"> |
|||
<view class="text-center h1">· 恭喜您获得额度 ·</view> |
|||
<view class="font-big"><text style="font-size: 34rpx; margin-right: 10rpx;">¥</text>{{hongbaoMoney}}</view> |
|||
<view></view> |
|||
<button class="box-btn" @tap="hideBox" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">确定</button> |
|||
</view> |
|||
|
|||
<view class="box-rule" v-if="showBoxrule" :style="{background:'linear-gradient(180deg,'+t('color1')+' 40%,rgba(255,255,255,0.8) 120%)'}"> |
|||
<view class="h2">活动规则说明</view> |
|||
<view id="close-rule" @tap="changeRule" :style="'background-image:url('+pre_url+'/static/img/dzp/close.png);background-size:100%'"></view> |
|||
<view class="con"> |
|||
<view class="text"> |
|||
<text decode="true" space="true">{{info.guize}}</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var windowWidth = uni.getSystemInfoSync().windowWidth; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
isStart: 1, |
|||
name: "", |
|||
error: "", |
|||
info:{}, |
|||
member:{}, |
|||
pagenum: 1, |
|||
showmaskrule: false, |
|||
showBoxrule:false, |
|||
showBoxhongbao:false, |
|||
latitude: "", |
|||
longitude: "", |
|||
windowWidth:0, |
|||
windowHeight:0, |
|||
tjdatalist:[], |
|||
data:{}, |
|||
todayRecord:{}, |
|||
hongbaoMoney:0 |
|||
}; |
|||
}, |
|||
onLoad:function(opt){ |
|||
this.opt = app.getopts(opt); |
|||
}, |
|||
onReady: function () { |
|||
var that = this; |
|||
var res = uni.getSystemInfoSync(); |
|||
that.windowWidth = res.windowWidth; |
|||
that.windowHeight = res.windowHeight; |
|||
this.getdata(); |
|||
}, |
|||
onShow: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(false); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(false); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getProlist(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
|
|||
getdata: function (loadmore) { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiHongbaoEveryday/index', {}, function (res) { |
|||
that.loading = false; |
|||
if(res.status == 0){ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.info = res.info; |
|||
that.member = res.member; |
|||
that.remaindaytimes = res.remaindaytimes; |
|||
that.remaintimes = res.remaintimes; |
|||
that.zjlist = res.zjlist; |
|||
that.data = res.data; |
|||
that.todayRecord = res.todayRecord; |
|||
uni.setNavigationBarTitle({ |
|||
title: res.info.name |
|||
}); |
|||
var title = that.info.name; |
|||
that.loaded(); |
|||
that.getProlist(loadmore); |
|||
|
|||
}); |
|||
}, |
|||
getProlist:function(loadmore){ |
|||
var that = this; |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.tjdatalist = []; |
|||
} |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
app.get('ApiHongbaoEveryday/prolist', {pagenum:pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.tjdatalist; |
|||
if (pagenum == 1) { |
|||
that.tjdatalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var tjdatalist = that.tjdatalist; |
|||
var newdata = tjdatalist.concat(data); |
|||
that.tjdatalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
getHongbao:function(){ |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiHongbaoEveryday/getHongbao', {}, function (res) { |
|||
that.loading = false; |
|||
if(res.status == 0){ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.hongbaoMoney = res.money; |
|||
that.changeBoxHongbao(); |
|||
}); |
|||
}, |
|||
sharecallback:function(){ |
|||
|
|||
}, |
|||
changeRule: function () { |
|||
this.showmaskrule = !this.showmaskrule; |
|||
this.showBoxrule = !this.showBoxrule; |
|||
}, |
|||
changeBoxHongbao: function () { |
|||
this.showmaskrule = !this.showmaskrule; |
|||
this.showBoxhongbao = !this.showBoxhongbao; |
|||
}, |
|||
hideBox:function(){ |
|||
this.showmaskrule = false; |
|||
this.showBoxhongbao = false; |
|||
this.getdata(); |
|||
}, |
|||
init: function () { |
|||
var windowWidth = this.windowWidth; |
|||
var windowHeight = this.windowHeight; |
|||
var that = this; |
|||
var width = windowWidth/750*600; |
|||
var height = windowWidth/750*320; |
|||
console.log(height) |
|||
|
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.text-center { text-align: center;} |
|||
.container {padding-bottom: 40rpx;} |
|||
.wrap {width:100%;height:100%;padding-top: 20rpx;} |
|||
.f1 {position: relative;} |
|||
.rule{width:60rpx;height:auto;padding:14rpx;font-size:28rpx;line-height:30rpx;text-align: center;border-radius:17rpx 0px 0px 17rpx; position: absolute; right: 0; top: -10rpx;} |
|||
.title {width:94%;height:316rpx;margin: auto;} |
|||
.content { text-align: center; background-color: #fff; border-radius: 20rpx; width: 94%; margin: 0 auto; margin-top: 40rpx; padding: 40rpx 0 20rpx;} |
|||
.content>view {line-height: 200%; margin: 40rpx 0;} |
|||
.col-3 {width: 33.33%;} |
|||
.card { width: 50%; padding: 4%; margin: 0 2%; border-radius: 20rpx;background: linear-gradient(90deg, #FFDDC3 0%, #FEF2DA 100%);} |
|||
.form-btn { width: 90%; border-radius: 40rpx; font-size: 32rpx; color: #fff; line-height:86rpx; margin-top: 80rpx;} |
|||
.font-normal { color: #999;} |
|||
.font-mid { font-size: 42rpx;} |
|||
.font-big { font-size: 64rpx;} |
|||
.font-big,.font-mid { font-weight: bold; color: #FD462A;} |
|||
|
|||
.box-hongbao {position: relative;margin: 30% auto;width: 100%;height: 70%;border-radius: 16rpx;} |
|||
.box-hongbao .h1 {color: #EB8A30; font-size: 32rpx; position: relative; top: 20%;} |
|||
.box-hongbao .font-big { position: relative; top: 26%; text-align: center;} |
|||
.box-btn { position:absolute; top:55%; width: 40%; left: 30%; border-radius: 30rpx;color: #fff; font-size: 32rpx; box-shadow:0px 5px 15px 5px rgb(51 51 51 / 30%);} |
|||
|
|||
.prolist{width: 100%;height:auto;padding: 8rpx 20rpx;} |
|||
|
|||
/*规则弹窗*/ |
|||
#mask-rule,#mask {position: fixed;left: 0;top: 0;z-index: 999;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.6);} |
|||
#mask-rule .box-rule {position: relative;margin: 30% auto;padding-top: 40rpx;width: 90%;height: 70%;border-radius: 16rpx;} |
|||
#mask-rule .box-rule .star {position: absolute;left: 50%;top: -100rpx;margin-left: -130rpx;width: 259rpx;height:87rpx;} |
|||
#mask-rule .box-rule .h2 {width: 100%;text-align: center;line-height: 34rpx;font-size: 34rpx;font-weight: normal;color: #fff;} |
|||
#mask-rule #close-rule {position: absolute;right: 34rpx;top: 38rpx;width: 40rpx;height: 40rpx;} |
|||
/*内容盒子*/ |
|||
#mask-rule .con {overflow: auto;position: relative;margin: 40rpx auto;padding: 15rpx;width:92%;height: 88%;line-height: 48rpx;font-size: 26rpx; border-radius: 16rpx; |
|||
color: #9E7E7E; background-color: #FEFBF2;} |
|||
#mask-rule .con .text {/* position: absolute;top: 0;left: 0; width: inherit;*/height: auto;} |
|||
@media screen and (min-width: 400px) { |
|||
.title {height:336rpx;} |
|||
} |
|||
|
|||
</style> |
|||
@ -0,0 +1,157 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="myscore" :style="{background:t('color1')}"> |
|||
<view class="f1">我的补贴</view> |
|||
<view class="f2">{{money}}<view class="btn-mini" v-if="withdraw" @tap="goto" data-url="withdraw">提现</view></view> |
|||
</view> |
|||
<dd-tab :itemdata="['补贴记录','提现记录']" :itemst="['0','2']" :st="st" :isfixed="false" @changetab="changetab"></dd-tab> |
|||
<view class="content" id="datalist"> |
|||
<block v-if="st==0"> |
|||
<view class="item" v-for="(item, index) in datalist" :key="index"> |
|||
<view class="f1"> |
|||
<text class="t1">{{item.remark}}</text> |
|||
<text class="t2">{{item.createtime}}</text> |
|||
</view> |
|||
<view class="f2"> |
|||
<block v-if="item.money>0"> |
|||
<text class="t1">+{{item.money}}</text> |
|||
</block> |
|||
<block v-else> |
|||
<text class="t2">{{item.money}}</text> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<block v-if="st==2"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<text class="t1">提现金额:{{item.money}}元 <text v-if="item.score > 0" style="margin-left: 10rpx;">{{t('积分')}}:{{item.score}}</text></text> |
|||
<text class="t2">{{item.createtime}}</text> |
|||
</view> |
|||
<view class="f3"> |
|||
<text class="t1" v-if="item.status==0">审核中</text> |
|||
<text class="t1" v-if="item.status==1">已审核</text> |
|||
<text class="t2" v-if="item.status==2">已驳回</text> |
|||
<text class="t1" v-if="item.status==3">已打款</text> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
st: 0, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
money: 0, |
|||
myscore2: 0, |
|||
nodata: false, |
|||
nomore: false, |
|||
scoreTransfer:false, |
|||
withdraw:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st || 0; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiHongbaoEveryday/log', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
uni.setNavigationBarTitle({ |
|||
title: '补贴记录' |
|||
}); |
|||
that.money = res.money; |
|||
that.withdraw= res.withdraw; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (st) { |
|||
var st = st; |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.myscore{width:94%;margin:20rpx 3%;border-radius: 10rpx 56rpx 10rpx 10rpx;position:relative;display:flex;flex-direction:column;padding:70rpx 0} |
|||
.myscore .f1{margin:0 0 0 60rpx;color:rgba(255,255,255,0.8);font-size:24rpx;} |
|||
.myscore .f2{margin:20rpx 0 0 60rpx;color:#fff;font-size:64rpx;font-weight:bold; position: relative;} |
|||
|
|||
.content{ width:94%;margin:0 3%;} |
|||
.content .item{width:100%;margin:20rpx 0;background:#fff;border-radius:5px;padding:20rpx 20rpx;display:flex;align-items:center} |
|||
.content .item .f1{display:flex;flex-direction:column; } |
|||
.content .item .f1 .t1{color:#000000;font-size:30rpx;word-break:break-all;overflow:hidden;text-overflow:ellipsis;} |
|||
.content .item .f1 .t2{color:#666666} |
|||
.content .item .f1 .t3{color:#666666} |
|||
.content .item .f2{ flex:1;font-size:36rpx;text-align:right} |
|||
.content .item .f2 .t1{color:#03bc01} |
|||
.content .item .f2 .t2{color:#000000} |
|||
.content .item .f3{ flex:1;font-size:30rpx;text-align:right} |
|||
.content .item .f3 .t1{color:#03bc01} |
|||
.content .item .f3 .t2{color:#000000} |
|||
|
|||
.data-empty{background:#fff} |
|||
.btn-mini {right: 32rpx;top: 28rpx;width: 100rpx;height: 50rpx;text-align: center;border: 1px solid #e6e6e6;border-radius: 10rpx;color: #fff;font-size: 24rpx;font-weight: bold;display: inline-flex;align-items: center;justify-content: center;position: absolute;} |
|||
</style> |
|||
@ -0,0 +1,202 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="mymoney" :style="{background:t('color1')}"> |
|||
<view class="f1">我的补贴</view> |
|||
<view class="f2"><text style="font-size:26rpx">¥</text>{{userinfo.hongbao_ereryday_total}}</view> |
|||
<view class="f3" @tap="goto" data-url="log?st=2"><text>提现记录</text><text class="iconfont iconjiantou" style="font-size:20rpx"></text></view> |
|||
</view> |
|||
<view class="content2"> |
|||
<view class="item2"><view class="f1">提现金额(元)</view></view> |
|||
<view class="item3"><view class="f1">¥</view><view class="f2"><input class="input" type="digit" name="money" value="" placeholder="请输入提现金额" placeholder-style="color:#999;font-size:40rpx" @input="moneyinput"/></view></view> |
|||
<view class="item4" v-if="sysset.withdrawfee>0 || sysset.withdrawmin>0"> |
|||
<text v-if="sysset.withdrawmin>0" style="margin-right:10rpx">最低提现金额{{sysset.withdrawmin}}元 </text> |
|||
<text v-if="sysset.withdrawfee>0">提现手续费{{sysset.withdrawfee}}% </text> |
|||
</view> |
|||
</view> |
|||
<view class="withdrawtype"> |
|||
<view class="f1">选择提现方式:</view> |
|||
<view class="f2"> |
|||
<view class="item" v-if="sysset.withdraw_weixin==1" @tap.stop="changeradio" data-paytype="微信钱包"> |
|||
<view class="t1"><image class="img" :src="event_rul + '/static/img/static/img/withdraw-weixin.png'"/>微信钱包</view> |
|||
<view class="radio" :style="paytype=='微信钱包' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
<label class="item" v-if="sysset.withdraw==1" @tap.stop="changeradio" data-paytype="余额"> |
|||
<view class="t1"><image class="img" :src="event_rul + '/static/img/static/img/withdraw-cash.png'"/>{{t('余额')}}</view> |
|||
<view class="radio" :style="paytype=='余额' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</label> |
|||
<label class="item" v-if="sysset.withdraw_score==1 && sysset.withdraw_score_bili>0" @tap.stop="changeradio" data-paytype="积分"> |
|||
<view class="t1"><image class="img" :src="event_rul + '/static/img/static/img/commissionlog.png'"/> |
|||
<view> |
|||
<view>{{t('积分')}}</view> |
|||
<view class="item-desc">{{sysset.withdraw_score_desc}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="radio" :style="paytype=='积分' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</label> |
|||
</view> |
|||
</view> |
|||
<button class="btn" form-type="submit" :style="{background:t('color1')}">立即提现</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
userinfo: [], |
|||
sysset: false, |
|||
paytype: '微信钱包', |
|||
show: 0, |
|||
tglset:[], |
|||
event_rul: app.globalData.event_url, |
|||
|
|||
}; |
|||
}, |
|||
|
|||
onShow: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiHongbaoEveryday/withdraw', {}, function (res) { |
|||
that.loading = false; |
|||
that.userinfo = res.userinfo; |
|||
that.sysset = res.sysset; |
|||
that.tmplids = res.tmplids; |
|||
that.tglset = res.tglset; |
|||
var sysset = res.sysset; |
|||
var paytype = '微信钱包'; |
|||
if (sysset.withdraw_weixin == 1) { |
|||
paytype = '微信钱包'; |
|||
} |
|||
if (!sysset.withdraw_weixin || sysset.withdraw_weixin == 0) { |
|||
paytype = '支付宝'; |
|||
} |
|||
if ((!sysset.withdraw_weixin || sysset.withdraw_weixin == 0) && (!sysset.withdraw_aliaccount || sysset.withdraw_aliaccount == 0)) { |
|||
paytype = '银行卡'; |
|||
} |
|||
that.paytype = paytype; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
moneyinput: function (e) { |
|||
var usermoney = parseFloat(this.userinfo.money); |
|||
var money = parseFloat(e.detail.value); |
|||
if (money < 0) { |
|||
app.error('必须大于0'); |
|||
} else if (money > usermoney) { |
|||
app.error('可提现余额不足'); |
|||
} |
|||
}, |
|||
changeradio: function (e) { |
|||
var that = this; |
|||
var paytype = e.currentTarget.dataset.paytype; |
|||
that.paytype = paytype; |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
console.log(e.detail.value) |
|||
var usermoney = parseFloat(this.userinfo.money); |
|||
var withdrawmin = parseFloat(this.sysset.withdrawmin); //var formdata = e.detail.value; |
|||
var money = parseFloat(e.detail.value.money); |
|||
var paytype = this.paytype; |
|||
if (isNaN(money) || money <= 0) { |
|||
app.error('提现金额必须大于0'); |
|||
return; |
|||
} |
|||
if (withdrawmin > 0 && money < withdrawmin) { |
|||
app.error('提现金额必须大于¥' + withdrawmin); |
|||
return; |
|||
} |
|||
if (money > usermoney) { |
|||
app.error('余额不足'); |
|||
return; |
|||
} |
|||
if (paytype == '支付宝' && !this.userinfo.aliaccount) { |
|||
app.alert('请先设置支付宝账号', function () { |
|||
app.goto('/pages/my/setaliaccount'); |
|||
}); |
|||
return; |
|||
} |
|||
if (paytype == '银行卡' && (!this.userinfo.bankname || !this.userinfo.bankcarduser || !this.userinfo.bankcardnum)) { |
|||
app.alert('请先设置完整银行卡信息', function () { |
|||
app.goto('/pages/my/setbankinfo'); |
|||
}); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiHongbaoEveryday/withdraw', {money: money,paytype: paytype}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} else { |
|||
app.success(res.msg); |
|||
that.subscribeMessage(function () { |
|||
setTimeout(function () { |
|||
app.goto('log?st=2'); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{display:flex;flex-direction:column} |
|||
.mymoney{width:94%;margin:20rpx 3%;border-radius: 10rpx 56rpx 10rpx 10rpx;position:relative;display:flex;flex-direction:column;padding:70rpx 0} |
|||
.mymoney .f1{margin:0 0 0 60rpx;color:rgba(255,255,255,0.8);font-size:24rpx;} |
|||
.mymoney .f2{margin:20rpx 0 0 60rpx;color:#fff;font-size:64rpx;font-weight:bold} |
|||
.mymoney .f3{height:56rpx;padding:0 10rpx 0 20rpx;border-radius: 28rpx 0px 0px 28rpx;background:rgba(255,255,255,0.2);font-size:20rpx;font-weight:bold;color:#fff;display:flex;align-items:center;position:absolute;top:94rpx;right:0} |
|||
|
|||
.content2{width:94%;margin:10rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;background:#fff} |
|||
.content2 .item1{display:flex;width:100%;border-bottom:1px solid #F0F0F0;padding:0 30rpx} |
|||
.content2 .item1 .f1{flex:1;font-size:32rpx;color:#333333;font-weight:bold;height:120rpx;line-height:120rpx} |
|||
.content2 .item1 .f2{color:#FC4343;font-size:44rpx;font-weight:bold;height:120rpx;line-height:120rpx} |
|||
|
|||
.content2 .item2{display:flex;width:100%;padding:0 30rpx;padding-top:10rpx} |
|||
.content2 .item2 .f1{height:80rpx;line-height:80rpx;color:#999999;font-size:28rpx} |
|||
|
|||
.content2 .item3{display:flex;width:100%;padding:0 30rpx;padding-bottom:20rpx} |
|||
.content2 .item3 .f1{height:100rpx;line-height:100rpx;font-size:60rpx;color:#333333;font-weight:bold;margin-right:20rpx} |
|||
.content2 .item3 .f2{display:flex;align-items:center;font-size:60rpx;color:#333333;font-weight:bold} |
|||
.content2 .item3 .f2 .input{font-size:60rpx;height:100rpx;line-height:100rpx;} |
|||
.content2 .item4{display:flex;width:94%;margin:0 3%;border-top:1px solid #F0F0F0;height:100rpx;line-height:100rpx;color:#8C8C8C;font-size:28rpx} |
|||
|
|||
.withdrawtype{width:94%;margin:20rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;margin-top:20rpx;background:#fff} |
|||
.withdrawtype .f1{height:100rpx;line-height:100rpx;padding:0 30rpx;color:#333333;font-weight:bold} |
|||
.item-desc { font-size: 22rpx; color:#FC5729;} |
|||
|
|||
|
|||
.withdrawtype .f2{padding:0 30rpx} |
|||
.withdrawtype .f2 .item{border-bottom:1px solid #f5f5f5;height:100rpx;display:flex;align-items:center} |
|||
.withdrawtype .f2 .item:last-child{border-bottom:0} |
|||
.withdrawtype .f2 .item .t1{flex:1;display:flex;align-items:center;color:#333} |
|||
.withdrawtype .f2 .item .t1 .img{width:44rpx;height:44rpx;margin-right:40rpx} |
|||
|
|||
.withdrawtype .f2 .item .radio{flex-shrink:0;width: 36rpx;height: 36rpx;background: #FFFFFF;border: 3rpx solid #BFBFBF;border-radius: 50%;margin-right:10rpx} |
|||
.withdrawtype .f2 .item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.btn{ height:100rpx;line-height: 100rpx;width:90%;margin:0 auto;border-radius:50rpx;margin-top:30rpx;color: #fff;font-size: 30rpx;font-weight:bold} |
|||
</style> |
|||
@ -0,0 +1,654 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul + '/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}} <text v-if="address.company">{{address.company}}</text></view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul + '/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
<view class="buydata"> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex"> |
|||
<view class="img"><image class="img" :src="product.pic"/></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2">原价: ¥{{product.sell_price}}</view> |
|||
<view class="f3">¥{{joininfo.now_price}}<text class="kanjia_icon">砍后价</text> × 1</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice*1 > product_price*1">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">商品金额</text> |
|||
<text class="f2">¥{{product_price}}</text> |
|||
</view> |
|||
<view class="price" v-if="leadermoney*1>0"> |
|||
<text class="f1">团长优惠</text> |
|||
<text class="f2">-¥{{leadermoney}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freight_price}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="scoredk" v-if="userinfo.score2money>0"> |
|||
<checkbox-group @change="scoredk" class="flex" style="width:100%"> |
|||
<view class="f1"> |
|||
<view>{{userinfo.score*1}} {{t('积分')}}可抵扣 <text style="color:#e94745">{{userinfo.scoredk_money*1}}</text> 元</view> |
|||
<view style="font-size:22rpx;color:#999" v-if="userinfo.scoredkmaxpercent > 0 && userinfo.scoredkmaxpercent<100">最多可抵扣订单金额的{{userinfo.scoredkmaxpercent}}%</view> |
|||
<view style="font-size:22rpx;color:#999" v-else-if="userinfo.scoremaxtype==1">最多可抵扣{{userinfo.scoredkmaxmoney}}元</view> |
|||
</view> |
|||
<view class="f2">使用{{t('积分')}}抵扣 |
|||
<checkbox value="1" style="margin-left:6px;transform:scale(.8)"></checkbox> |
|||
</view> |
|||
</checkbox-group> |
|||
</view> |
|||
|
|||
<view style="width: 100%; height:110rpx;"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="text1 flex1">总计: |
|||
<text style="font-weight:bold;font-size:36rpx">¥{{totalprice}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul + '/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
productList: [], |
|||
freightList: [], |
|||
couponList: [], |
|||
couponrid: 0, |
|||
coupontype: 1, |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
usescore: 0, |
|||
totalprice: '0.00', |
|||
product_price: 0, |
|||
isload: 0, |
|||
storedata: [], |
|||
storeid: '', |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
leadermoney: 0, |
|||
couponvisible: false, |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
product: "", |
|||
userinfo: "", |
|||
joininfo: "", |
|||
weight: "", |
|||
goodsnum: 0, |
|||
scorebdkyf: "", |
|||
havetongcheng: "", |
|||
beizhu: "", |
|||
couponkey: 0, |
|||
storeshowall:false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiKanjia/buy', {joinid: that.opt.joinid}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
} |
|||
var product = res.product; |
|||
var freightList = res.freightList; |
|||
var userinfo = res.userinfo; |
|||
var couponList = res.couponList; |
|||
var joininfo = res.joininfo; |
|||
that.product = product; |
|||
that.freightList = freightList; |
|||
that.userinfo = userinfo; |
|||
that.couponList = couponList; |
|||
that.joininfo = joininfo; |
|||
that.product_price = joininfo['now_price']; |
|||
that.weight = product.weight; |
|||
that.goodsnum = 1; |
|||
that.address = res.address; |
|||
that.scorebdkyf = res.scorebdkyf; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
|
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
|
|||
for (var j in freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude) { |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
|
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
|
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
|
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var product_price = parseFloat(that.product_price); //+商品总价 |
|||
var address = that.address; //算运费 |
|||
var freightdata = that.freightList[that.freightkey]; |
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress; |
|||
var freight_price = freightdata.freight_price; |
|||
|
|||
var totalprice = product_price + freight_price; |
|||
if (that.usescore) { //使用积分抵扣 |
|||
var scoredk_money = parseFloat(that.userinfo.scoredk_money); |
|||
var scoredkmaxpercent = parseFloat(that.userinfo.scoredkmaxpercent); //最大抵扣比例 |
|||
if (scoredkmaxpercent > 0 && scoredkmaxpercent < 100 && scoredk_money > totalprice * scoredkmaxpercent * 0.01) { |
|||
scoredk_money = totalprice * scoredkmaxpercent * 0.01; |
|||
} |
|||
if(that.scorebdkyf=='1' && scoredk_money > 0 && totalprice - scoredk_money < freight_price){ //积分不抵扣运费 |
|||
scoredk_money = totalprice - freight_price; |
|||
} |
|||
} else { |
|||
var scoredk_money = 0; |
|||
} |
|||
var totalprice = totalprice - scoredk_money; //-积分抵扣 |
|||
|
|||
if (totalprice < 0) totalprice = 0; |
|||
freight_price = freight_price.toFixed(2); |
|||
totalprice = totalprice.toFixed(2); |
|||
that.totalprice = totalprice; |
|||
that.freight_price = freight_price; |
|||
}, |
|||
//积分抵扣 |
|||
scoredk: function (e) { |
|||
var usescore = e.detail.value[0]; |
|||
if (!usescore) usescore = 0 |
|||
this.usescore = usescore; |
|||
this.calculatePrice(); |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
chooseCoupon: function (e) { |
|||
var couponrid = e.rid; |
|||
var couponkey = e.key; |
|||
|
|||
if (couponrid == this.couponrid) { |
|||
this.couponkey = 0; |
|||
this.couponrid = 0; |
|||
this.coupontype = 1; |
|||
this.coupon_money = 0; |
|||
this.couponvisible = false; |
|||
} else { |
|||
var couponList = this.couponList; |
|||
var coupon_money = couponList[couponkey]['money']; |
|||
var coupontype = couponList[couponkey]['type']; |
|||
if (coupontype == 4) { |
|||
coupon_money = this.freightprice; |
|||
} |
|||
this.couponkey = couponkey; |
|||
this.couponrid = couponrid; |
|||
this.coupontype = coupontype; |
|||
this.coupon_money = coupon_money; |
|||
this.couponvisible = false; |
|||
} |
|||
this.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var joinid = this.opt.joinid; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
var usescore = this.usescore |
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var freight_time = that.freight_time; |
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiKanjia/createOrder', {joinid: joinid,freightid: freightid,freight_time: freight_time,storeid: storeid,addressid: addressid,linkman: linkman,tel: tel,usescore:usescore,formdata:newformdata}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.error(data.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + data.payorderid); |
|||
}); |
|||
}, |
|||
showCouponList: function () { |
|||
this.couponvisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.couponvisible = false; |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:10rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .text1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .text1 text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
|
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,101 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="recordList"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="ListItem"> |
|||
<image class="firendAvatar" :src="item.headimg"></image> |
|||
<text class="styleText">{{item.nickname}}</text> 于 {{item.createtime}} 帮您砍掉了 <text class="styleText">{{item.cut_price}}元</text>,砍后价格 <text class="styleText">{{item.after_price}}元</text> |
|||
<view class="clear"></view> |
|||
</view> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
isload:true, |
|||
pagenum: 1, |
|||
st: '', |
|||
datalist: [], |
|||
nomore: false |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(true); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (e) { |
|||
var st = e.currentTarget.dataset.st; |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var st = that.st; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nomore = false; |
|||
that.nodata = false; |
|||
app.post('ApiKanjia/helplist', {st: st,pagenum: pagenum,joinid: that.opt.joinid}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
page {
background: #fff;} |
|||
.recordList .ListItem {
margin: 0 40rpx;
font-size: 13px;
border-bottom: 1px solid #eee;
padding: 40rpx 0;
} |
|||
.ListItem .firendAvatar {
float: left;
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 20rpx;
margin-top: 10rpx;
} |
|||
.ListItem .styleText {
color: #dbb243;
} |
|||
</style> |
|||
@ -0,0 +1,150 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="banner"><image :src="pic" mode="widthFix"></image></view> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view :data-url="'product?id=' + item.id" @tap="goto" class="product-item2"> |
|||
<view class="product-pic"> |
|||
<image :src="item.pic" mode="widthFix"></image> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="p1">{{item.name}}</view> |
|||
<view class="p2"> |
|||
<view v-for="(join, index2) in item.joinlist" :key="index2" class="t1"> |
|||
<image :src="join.headimg"></image> |
|||
</view> |
|||
<view class="t1" v-if="item.saleing>7"> |
|||
<image :src="event_rul + '/static/img/static/img/moreuser.png'"></image> |
|||
</view> |
|||
<view class="t2">{{item.saleing}}人正在参加</view> |
|||
</view> |
|||
<view class="p3"> |
|||
<view class="t1"> |
|||
<text class="x1"><text style="font-size:22rpx">最低¥</text>{{item.min_price}}</text> |
|||
<text class="x2">¥{{item.sell_price}}</text> |
|||
</view> |
|||
<button class="t2" @tap="todetail" :data-id="item.id">去砍价</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nomore v-if="nomore" textcolor="#faa" linecolor="#f66"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
<button class="covermy" @tap="goto" data-url="orderlist">我的订单</button> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
bid:'', |
|||
pagenum: 1, |
|||
st: '', |
|||
datalist: [], |
|||
nomore: false, |
|||
nodata: false, |
|||
pic:'', |
|||
pics: "", |
|||
clist:[], |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.bid = this.opt.bid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var st = that.st; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nomore = false; |
|||
that.nodata = false; |
|||
app.post('ApiKanjia/index', {bid:that.bid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.pic = res.pic; |
|||
that.pics = res.pics; |
|||
that.clist = res.clist; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
page{background:#F34343} |
|||
.container{background:#F34343} |
|||
|
|||
.swiper {width: 100%;height: 375rpx;margin-bottom: 20rpx;} |
|||
.swiper image {width: 100%;height: 375rpx;overflow: hidden;} |
|||
|
|||
.banner{width:100%;} |
|||
.banner image{width:100%;height:auto} |
|||
|
|||
.category{width: 100%;padding-top: 10px;padding-bottom: 10px;flex-direction:row;white-space: nowrap; display:flex;} |
|||
.category .item{width: 150rpx;display: inline-block; text-align: center;} |
|||
.category .item image{width: 80rpx;height: 80rpx;margin: 0 auto;border-radius: 50%;} |
|||
.category .item .t1{display: block;color: #666;} |
|||
|
|||
.product-item2 {display:flex;height: 240rpx; background: #fff; padding:30rpx 20rpx;margin: 0 20rpx;margin-bottom:20rpx;border-radius:20rpx} |
|||
.product-item2 .product-pic {width: 180rpx;height: 180rpx; background: #ffffff;overflow:hidden} |
|||
.product-item2 .product-pic image{width: 100%;height:180rpx;} |
|||
.product-item2 .product-info {width:570rpx;padding: 5rpx 10rpx;flex:1} |
|||
.product-item2 .product-info .p1 {word-break: break-all;text-overflow: ellipsis;overflow: hidden;display: block;height: 80rpx;line-height: 40rpx;font-size: 30rpx;color:#111111} |
|||
.product-item2 .product-info .p2{padding-left:10rpx;height:60rpx;display:flex;align-items:center} |
|||
.product-item2 .product-info .p2 .t1{margin-left: -10rpx;height:40rpx;} |
|||
.product-item2 .product-info .p2 .t1 image{width:40rpx;height:40rpx;border-radius: 50%;border:2px solid #fff;} |
|||
.product-item2 .product-info .p2 .t2{font-size:24rpx;color:#787878} |
|||
.product-item2 .product-info .p3{font-size: 32rpx;height:40rpx;line-height: 40rpx;display:flex;align-items:center} |
|||
.product-item2 .product-info .p3 .t1{flex:auto} |
|||
.product-item2 .product-info .p3 .t1 .x1{color: #f40;} |
|||
.product-item2 .product-info .p3 .t1 .x2{margin-left: 10rpx;font-size: 26rpx;color: #888;text-decoration: line-through;} |
|||
.product-item2 .product-info .p3 .t2{padding:0 16rpx;font-size: 22rpx;height:44rpx;line-height:44rpx;overflow: hidden;color:#fff;background:#ee4f4f;border:0;border-radius:20rpx;} |
|||
.product-item2 .product-info .p3 button:after{border:0} |
|||
|
|||
.covermy{position:absolute;z-index:99999;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;z-index:9999;top:350rpx;right:0;color:#fff;background-color:rgba(17,17,17,0.3);width:140rpx;height:60rpx;font-size:26rpx;border-radius:30rpx 0px 0px 30rpx;} |
|||
|
|||
.nomore-footer-tips{background:#F34343;color:#fff} |
|||
</style> |
|||
@ -0,0 +1,376 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container" :style="'background:url(' + pre_url + '/static/img/kanjia-bg.png) no-repeat;background-size:100% auto;'"> |
|||
<view class="topcontent"> |
|||
<image :src="pre_url + '/static/img/kanjia-hb.png'" class="hongbao"></image> |
|||
<view class="userinfo"> |
|||
<view class="f1"><image :src="joinuserinfo.headimg"></image></view> |
|||
<view class="f2">{{joinuserinfo.nickname}}</view> |
|||
</view> |
|||
<view class="content"> |
|||
<view class="title">〝我看中这个宝贝, 快帮我砍一刀〞</view> |
|||
<view class="proinfo"> |
|||
<view class="f1"> |
|||
<image :src="product.pic" @tap="goto" :data-url="'product?id=' + product.id"></image> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">{{product.name}}</view> |
|||
<view class="t2">已砍走 <text style="color:#FF4C00">{{product.sales}}</text> 件</view> |
|||
<view class="t3">¥<text class="x1">{{product.min_price}}</text> <text class="x2">¥{{product.sell_price}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="progressinfo"> |
|||
<view class="t0">已砍 <text class="x1">¥{{joininfo.yikan_price}}</text>,剩余 <text class="x2">¥{{joininfo.now_price}}</text></view> |
|||
<view class="t2"> |
|||
<progress :percent="cut_percent" border-radius="3" activeColor="#FF3143" backgroundColor="#FFD1C9" active="true"></progress> |
|||
</view> |
|||
<view class="t3"> |
|||
<view class="x1">原价:<text style="color:#FF3143">¥{{product.sell_price}}</text></view> |
|||
<view class="x2">最低砍至:<text style="color:#FF3143">¥{{product.min_price}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<button @tap="shareClick" class="btn1" v-if="mid==joininfo.mid && joininfo.status==0" style="background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);">召唤好友帮我砍价</button> |
|||
<button @tap="goto" class="btn1" style="background:#FC4343;width:320rpx" :data-url="'buy?joinid=' + joininfo.id" v-if="mid==joininfo.mid && (joininfo.status==1) && joininfo.isbuy==0">前去下单</button> |
|||
<button @tap="goto" data-url="orderlist" class="btn1" style="background:#FC4343;width:320rpx" v-if="mid==joininfo.mid && joininfo.isbuy==1">查看订单</button> |
|||
<button @tap="doKan" class="btn1" style="background:#FC4343;width:320rpx" v-if="mid!=joininfo.mid && iskan==0">帮他砍价</button> |
|||
<button @tap="goto" :data-url="'product?id=' + product.id" class="btn1" style="background:#FC4343;width:320rpx" v-if="mid!=joininfo.mid && iskan==1">我也要参与</button> |
|||
<button @tap="goto" :data-url="'helplist?joinid=' + joininfo.id" class="btn1">帮砍记录</button> |
|||
</view> |
|||
<view class="op" v-if="mid==joininfo.mid && (joininfo.status==0 && product.directbuy==1) && joininfo.isbuy==0" style="margin-top:20rpx"> |
|||
<button @tap="goto" class="btn1" style="background:linear-gradient(90deg,#FE6748 0%, #FF3143 100%);width:560rpx" :data-url="'buy?joinid=' + joininfo.id">现在就去下单</button> |
|||
</view> |
|||
<view class="lefttime"> |
|||
<view class="t1">距活动结束还剩:</view> |
|||
<view class="t2">{{djs}}</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image src="https://dev.lansoft.shop/static/img/static/img/close.png" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image :src="event_rul + '/static/img/static/img/close.png'"></image></view> |
|||
<view class="content"> |
|||
<image :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="kanjiaDialog" v-if="showkanjia"> |
|||
<view class="main"> |
|||
<view class="content"> |
|||
<view class="bargainIco"> |
|||
<!-- <text class="bargainIcoPrice">{{helpinfo.cut_price}}</text> --> |
|||
<image class="bargainIcoImg" :src="pre_url + '/static/img/bargainbg.png'"></image> |
|||
</view> |
|||
<block v-if="joininfo.mid == helpinfo.mid"> |
|||
<view class="bargainPrice">砍掉{{helpinfo.cut_price}}元</view> |
|||
<text class="bargainText">您自己砍了第一刀</text> |
|||
</block> |
|||
<block v-else> |
|||
<view class="bargainPrice">帮好友砍掉{{helpinfo.cut_price}}元</view> |
|||
</block> |
|||
<form @submit="hideKanjiaDialog" reportSubmit="true"> |
|||
<button class="bargainBtn SysBtn" form-type="submit" type="default">确定</button> |
|||
</form> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
product:{}, |
|||
mid:'', |
|||
iskan:0, |
|||
nowtime: "", |
|||
djs: "", |
|||
showkanjia: false, |
|||
helpinfo: {}, |
|||
joininfo: {}, |
|||
joinuserinfo:{}, |
|||
cut_percent: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
onShareAppMessage: function () { |
|||
var that = this; |
|||
this.sharetypevisible = false; |
|||
var thisurl = '/activity/kanjia/join?scene=pid_'+app.globalData.mid+'-proid_'+that.product.id+'-joinid_' + that.joininfo.id; |
|||
console.log(thisurl); |
|||
return { |
|||
title: '快来帮我砍一刀~ ' + that.product.name, |
|||
imageUrl: that.product.pics[0], |
|||
path: thisurl |
|||
}; |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var that = this; |
|||
var query = 'scene=pid_'+app.globalData.mid+'-proid_'+that.product.id+'-joinid_' + that.joininfo.id; |
|||
console.log(query); |
|||
return { |
|||
title: '快来帮我砍一刀~ ' + that.product.name, |
|||
imageUrl: that.product.pics[0], |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var proid = that.opt.proid; |
|||
var joinid = that.opt.joinid ? that.opt.joinid : ''; |
|||
clearInterval(interval); |
|||
that.loading = true; |
|||
app.get('ApiKanjia/join', {proid: proid,joinid: joinid}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.mid = res.mid; |
|||
that.product = res.product; |
|||
that.joininfo = res.joininfo; |
|||
that.joinuserinfo = res.joinuserinfo; |
|||
that.nowtime = res.nowtime; |
|||
that.cut_percent = res.cut_percent; |
|||
that.iskan = res.iskan; |
|||
var pagecontent = JSON.parse(res.product.detail); |
|||
|
|||
that.pagecontent = pagecontent |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
if (res.joininfo.helpnum == 0) { |
|||
that.doKan(); |
|||
} |
|||
var sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/kanjia/join?scene=pid_'+app.globalData.mid+'-proid_'+that.product.id+'-joinid_' + that.joininfo.id + '&t='+parseInt((new Date().getTime())/1000); |
|||
that.loaded({title:that.product.name,desc:'快来帮我砍一刀~ ',pic:that.product.pics[0],link:sharelink}); |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var totalsec = that.product.endtime * 1 - that.nowtime * 1; |
|||
if (totalsec <= 0) { |
|||
var djs = '00时00分00秒'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djs = (date > 0 ? date + '天' : '') + (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
} |
|||
that.djs = djs; |
|||
}, |
|||
doKan: function () { |
|||
var that = this; |
|||
var product = that.product; |
|||
app.post('ApiKanjia/kanjiaKan', {joinid: that.joininfo.id}, function (res) { |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var cut_percent = Math.round((product.sell_price * 1 - res.joininfo.now_price * 1) / (product.sell_price * 1 - product.min_price * 1) * 100); |
|||
that.showkanjia = true; |
|||
that.helpinfo = res.helpinfo; |
|||
that.joininfo = res.joininfo; |
|||
that.cut_percent = cut_percent; |
|||
that.getdata(); |
|||
}); |
|||
}, |
|||
hideKanjiaDialog: function (e) { |
|||
this.showkanjia = !this.showkanjia; |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiKanjia/getJoinPoster', {proid: that.product.id,joinid: that.joininfo.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = '快来帮我砍一刀~ ' + that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
|
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/kanjia/join?scene=pid_'+app.globalData.mid+'-proid_'+that.product.id+'-joinid_' + that.joininfo.id + '&t='+parseInt((new Date().getTime())/1000); |
|||
sharedata.imageUrl = that.product.pic; |
|||
|
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
page{background: linear-gradient(0deg, #DF3939 0%, #FF2B49 100%);} |
|||
.container{padding-top:280rpx;display:flex;flex-direction:column} |
|||
.topcontent{background:#FFDCB4;border-radius:20rpx;width:94%;margin:0 3%;position:relative;padding:12rpx;margin-bottom:20rpx} |
|||
.topcontent .hongbao{position:absolute;top:-32rpx;right:20rpx;width:128rpx;height:88rpx} |
|||
.topcontent .userinfo{width:100%;display:flex;flex-direction:column;align-items:center;position:absolute;top:-60rpx} |
|||
.topcontent .userinfo .f1{width:126rpx;height:126rpx;background:#FA6251;border-radius:50%;padding:8rpx} |
|||
.topcontent .userinfo .f1 image{width:100%;height:100%;border-radius:50%;} |
|||
.topcontent .userinfo .f2{font-size:28rpx;color:#999999;margin-top:8rpx} |
|||
.topcontent .content{background:#fff;padding-top:92rpx;padding-bottom:20rpx;border-radius:20rpx;} |
|||
.topcontent .title{font-size:40rpx;color:#514544;font-weight:bold;padding:32rpx 0;text-align:center} |
|||
.topcontent .proinfo{width:100%;background:#F5F5F5;padding:16rpx;display:flex;} |
|||
.topcontent .proinfo .f1{width:240rpx;height:240rpx} |
|||
.topcontent .proinfo .f1 image{width:100%;height:100%} |
|||
.topcontent .proinfo .f2{flex:1;padding-left:20rpx} |
|||
.topcontent .proinfo .f2 .t1{width:100%;height:80rpx;line-height:40rpx;font-size:30rpx;color:#5A4742;font-weight:bold;overflow:hidden} |
|||
.topcontent .proinfo .f2 .t2{color:#999999;font-size:26rpx;margin-top:10rpx} |
|||
.topcontent .proinfo .f2 .t3{color:#FF4C00;margin-top:30rpx} |
|||
.topcontent .proinfo .f2 .t3 .x1{font-size:48rpx;font-weigth:bold;padding-right:10rpx} |
|||
.topcontent .proinfo .f2 .t3 .x2{font-size:24rpx;color:#999999;text-decoration: line-through;} |
|||
|
|||
.topcontent .progressinfo{width:100%;padding:80rpx 40rpx;display:flex;flex-direction:column} |
|||
.topcontent .progressinfo .t0{width:100%;color:#222;font-size:30rpx;font-weight:bold;display:flex;text-align:center;justify-content:center} |
|||
.topcontent .progressinfo .t0 .x1{color:#FF1324} |
|||
.topcontent .progressinfo .t0 .x2{color:#FF3143} |
|||
.topcontent .progressinfo .t1{width:100%;color:#f60;font-size:36rpx;flex:auto;display:flex;} |
|||
.topcontent .progressinfo .t2{width:100%;padding:20rpx 0} |
|||
.topcontent .progressinfo .t3{width:100%;color:#222;font-size:28rpx;display:flex;} |
|||
.topcontent .progressinfo .t3 .x1{width:50%} |
|||
.topcontent .progressinfo .t3 .x2{width:50%;text-align:right} |
|||
.weui-progress{width:100%;} |
|||
.weui-progress__bar{height:16rpx;background-color:#FFD1C9;border-radius: 8rpx;} |
|||
.weui-progress__inner-bar{background-color:#FF3143;border-radius: 8rpx;} |
|||
|
|||
.topcontent .op{margin:0 20rpx 40rpx 20rpx;display:flex;align-items:center;justify-content:center} |
|||
.topcontent .op button{height:80rpx;line-height:80rpx;font-size:30rpx;padding:0 40rpx;border-radius:40rpx;background:#FC9144;width:auto;color:#fff;margin:0 20rpx} |
|||
.topcontent .op button:after{border:0} |
|||
|
|||
.topcontent .lefttime{margin-top:20rpx;border-top:1px solid #f5f5f5;color:#222;font-weight:bold;display:flex;text-align:center;justify-content:center;padding:20rpx 20rpx 0 20rpx} |
|||
.topcontent .lefttime .t2{color:#FF3143} |
|||
|
|||
|
|||
.op{margin:40rpx;display:flex;align-items:center;justify-content:center} |
|||
.op button{height:80rpx;line-height:80rpx;font-size:32rpx;padding:0 40rpx;border-radius:10rpx;background:#FC9144;width:auto;color:#fff} |
|||
.op button:after{border:0} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:901;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:999;top:0;left:0} |
|||
.posterDialog .main{ width:80%;margin:30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close image{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content image{width:540rpx;height:960rpx} |
|||
|
|||
.kanjiaDialog{ position:fixed;z-index:901;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:999;top:0;left:0;align-items:center} |
|||
.kanjiaDialog .main{ width:70%;margin:auto;margin-top:50%;background:#fff;position:relative;border-radius:20rpx} |
|||
.kanjiaDialog .content{ width:100%;padding:30rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.kanjiaDialog .content .bargainIco {width: 200rpx;height: 200rpx;color: #ca2428;margin: 20rpx auto;position: relative;} |
|||
.kanjiaDialog .content .bargainIcoImg {width: 200rpx;height: 200rpx;} |
|||
.kanjiaDialog .content .bargainIcoPrice {width: 120rpx;height: 100rpx;transform: rotate(-16deg);position: absolute;top: 70rpx;left: 44rpx;} |
|||
.kanjiaDialog .content .bargainPrice {color: #ca2428;font-size: 14px;} |
|||
.kanjiaDialog .content .bargainText {font-size: 12px;margin: 4rpx 0 12rpx;} |
|||
.kanjiaDialog .content .bargainBtn {background: #f60;margin: 0 20rpx;color: #fff;padding: 10rpx 0;margin-top: 20rpx;height: 80rpx;line-height: 60rpx;border-radius: 0;} |
|||
.kanjiaDialog .content .bargainBtn::after {border: 0;} |
|||
</style> |
|||
@ -0,0 +1,389 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
<view class="t2" v-if="djs">剩余时间:{{djs}}</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择'+codtxt : '已成功付款'}}</view> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" v-if="detail.freight_type!=3" user-select="true" selectable="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul + '/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true" selectable="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1 && detail.freight_type!=3" user-select="true" selectable="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true" selectable="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="btitle flex-y-center" v-if="detail.bid>0"> |
|||
<image :src="binfo.logo" style="width:36rpx;height:36rpx;" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid"></image> |
|||
<text class="flex1" decode="true" space="true" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid" style="padding-left:16rpx">{{binfo.name}}</text> |
|||
</view> |
|||
<view class="product"> |
|||
<view class="content"> |
|||
<view @tap="goto" :data-url="'/pages/shop/product?id=' + detail.proid"> |
|||
<image :src="detail.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{detail.proname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{detail.sell_price}}</text><text class="x2">×{{detail.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true" selectable="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytype!='货到付款' && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付方式</text> |
|||
<text class="t2">{{detail.paytype == '货到付款' ? codtxt : detail.paytype}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{detail.product_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.disprice > 0"> |
|||
<text class="t1">{{t('会员')}}折扣</text> |
|||
<text class="t2 red">-¥{{detail.leveldk_money}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.jianmoney > 0"> |
|||
<text class="t1">满减活动</text> |
|||
<text class="t2 red">-¥{{detail.manjian_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_type==1 && detail.freightprice > 0"> |
|||
<text class="t1">服务费</text> |
|||
<text class="t2 red">+¥{{detail.freight_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.couponmoney > 0"> |
|||
<text class="t1">{{t('优惠券')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.coupon_money}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.scoredk > 0"> |
|||
<text class="t1">{{t('积分')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.scoredk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<text class="t2" v-if="detail.status==1">已付款</text> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款原因</text> |
|||
<text class="t2 red">{{detail.refund_reason}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_checkremark"> |
|||
<text class="t1">审核备注</text> |
|||
<text class="t2 red">{{detail.refund_checkremark}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.isfuwu && detail.fuwuendtime > 0"> |
|||
<text class="t1">到期时间</text> |
|||
<text class="t2 red">{{_.date(detail.fuwuendtime,'Y-m-d H:i')}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true" selectable="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="detail.status==1"> |
|||
<block v-if="detail.paytype!='货到付款'"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn ref">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2"> |
|||
<block v-if="detail.paytype!='货到付款'"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
</block> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="orderCollect" :data-id="detail.id" v-if="detail.paytype!='货到付款'">确认收货</view> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
<block v-if="(detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3 || detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul + '/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
prodata: '', |
|||
djs: '', |
|||
iscommentdp: "", |
|||
detail: "", |
|||
prolist: "", |
|||
shopset: "", |
|||
storeinfo: "", |
|||
lefttime: "", |
|||
codtxt: "", |
|||
binfo:{}, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiKanjia/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.iscommentdp = res.iscommentdp, |
|||
that.detail = res.detail; |
|||
that.prolist = res.prolist; |
|||
that.shopset = res.shopset; |
|||
that.storeinfo = res.storeinfo; |
|||
that.binfo = res.binfo; |
|||
that.lefttime = res.lefttime; |
|||
that.codtxt = res.codtxt; |
|||
that.isload = 1; |
|||
if (res.lefttime > 0) { |
|||
interval = setInterval(function () { |
|||
that.lefttime = that.lefttime - 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var totalsec = that.lefttime; |
|||
|
|||
if (totalsec <= 0) { |
|||
that.djs = '00时00分00秒'; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
that.djs = djs; |
|||
} |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiKanjia/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiKanjia/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('收货中'); |
|||
app.post('ApiKanjia/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{height: 80rpx;line-height: 40rpx;color: #000;overflow:hidden} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.product .content .comment2{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc7c2 solid; border-radius:10rpx;background:#fff; color: #ffc7c2; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px;left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
|
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
.btitle{ width:100%;height:100rpx;background:#fff;padding:0 20rpx;border-bottom:1px solid #f5f5f5} |
|||
.btitle .comment{border: 1px #ffc702 solid;border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.btitle .comment2{border: 1px #ffc7c0 solid;border-radius:10rpx;background:#fff; color: #ffc7c0; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,227 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['全部','待付款','待发货','待收货','已完成','退款']" :itemst="['all','0','1','2','3','10']" :st="st" :isfixed="true" @changetab="changetab"></dd-tab> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap.stop="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<view class="f1" v-if="item.bid!=0" @tap.stop="goto" :data-url="'/pages/business/index?id=' + item.bid"><image :src="event_rul + '/static/img/static/img/ico-shop.png'"></image> {{item.binfo.name}}</view> |
|||
<view v-else>订单号:{{item.ordernum}}</view> |
|||
<view class="flex1"></view> |
|||
<text v-if="item.status==0" class="st0">待付款</text> |
|||
<text v-if="item.status==1 && item.freight_type!=1" class="st1">待发货</text> |
|||
<text v-if="item.status==1 && item.freight_type==1" class="st1">待提货</text> |
|||
<text v-if="item.status==2" class="st2">待收货</text> |
|||
<text v-if="item.status==3" class="st3">已完成</text> |
|||
<text v-if="item.status==4" class="st4">已关闭</text> |
|||
</view> |
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item.proid"> |
|||
<image :src="item.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.proname}}</text> |
|||
<text class="t2">原价:¥{{item.sell_price}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{item.product_price}}</text><text class="x2">×1</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="bottom"> |
|||
<text>共计{{item.procount}}件商品 实付:¥{{item.totalprice}}</text> |
|||
<text v-if="item.refund_status==1" style="color:red"> 退款中¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==2" style="color:red"> 已退款¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==3" style="color:red"> 退款申请已驳回</text> |
|||
</view> |
|||
<view class="op"> |
|||
<view @tap.stop="goto" :data-url="'orderdetail?id=' + item.id" class="btn2">详情</view> |
|||
<block v-if="item.status==0"> |
|||
<view class="btn2" @tap.stop="toclose" :data-id="item.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="goto" :data-url="'/pages/pay/pay?id=' + item.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="item.status==1"> |
|||
<block v-if="item.paytype!='货到付款'"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
<block v-if="item.status==2"> |
|||
<block v-if="item.paytype!='货到付款'"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
<view class="btn2" @tap.stop="goto" :data-url="'/pages/order/logistics?express_com=' + item.express_com + '&express_no=' + item.express_no" v-if="item.freight_type!=3 && item.freight_type!=4">查看物流</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="orderCollect" :data-id="item.id" v-if="item.paytype!='货到付款'">确认收货</view> |
|||
</block> |
|||
<block v-if="item.status==3 || item.status==4"> |
|||
<view class="btn2" @tap.stop="todel" :data-id="item.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
codtxt: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiKanjia/orderlist', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiKanjia/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiKanjia/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.post('ApiKanjia/orderCollect', {orderid: orderid}, function (data) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;margin-top:90rpx} |
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
.order-box .head .st0{ width: 140rpx; color: #ff8758; text-align: right; } |
|||
.order-box .head .st1{ width: 140rpx; color: #ffc702; text-align: right; } |
|||
.order-box .head .st2{ width: 140rpx; color: #ff4246; text-align: right; } |
|||
.order-box .head .st3{ width: 140rpx; color: #999; text-align: right; } |
|||
.order-box .head .st4{ width: 140rpx; color: #bbb; text-align: right; } |
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
/*.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px; font-size: 14px; position: absolute; bottom: 10px; right: 10px; background: #fff; }*/ |
|||
.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px;} |
|||
|
|||
.zan-tex{clear:both; display: block; width: 100%; color: #565656; font-size: 12px; height: 30px; line-height: 30px; text-align: center; } |
|||
.ind-bot{ width: 100%; float: left; text-align: center; height: 50px; line-height: 50px; font-size: 13px; color: #ccc; background:#F2F2F2} |
|||
</style> |
|||
@ -0,0 +1,450 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="swiper-container"> |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{product.pics.length}}</view> |
|||
</view> |
|||
<view class="kanjia_title"> |
|||
<view class="f1"> |
|||
<view class="t1">砍价最低 </view> |
|||
<view class="t2"><text style="font-size:40rpx;font-weight:bold">{{product.min_price}}</text> 元可拿</view> |
|||
<view class="t3">{{product.sales}}人已砍价成功</view> |
|||
</view> |
|||
<view class="f3"> |
|||
<view class="t1">{{ product.starttime > nowtime ? '距活动开始还有' : '距活动结束还剩'}}</view> |
|||
<view class="t2" id="djstime"><text class="djsspan">{{djsday}}</text> 天 <text class="djsspan">{{djshour}}</text> : <text class="djsspan">{{djsmin}}</text> : <text class="djsspan">{{djssec}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="header"> |
|||
<view class="title"> |
|||
<view class="lef"> |
|||
<text>{{product.name}}</text> |
|||
</view> |
|||
<view class="share" @tap="shareClick"> |
|||
<image :src="event_rul + '/static/img/static/img/share.png'"></image> |
|||
<text>分享</text> |
|||
</view> |
|||
</view> |
|||
<view class="sales_stock"> |
|||
<view class="f1">原价:¥{{product.sell_price}} </view> |
|||
<view class="f2">已砍走{{product.sales}}件 剩余{{product.stock}}件</view> |
|||
</view> |
|||
</view> |
|||
<view class="joinlist" v-if="product.saleing>0"> |
|||
<view v-for="(join, index) in joinlist" :key="index" class="t1"> |
|||
<image :src="join.headimg"></image> |
|||
</view> |
|||
<view class="t1" v-if="product.saleing>7"> |
|||
<image :src="event_rul + '/static/img/static/img/moreuser.png'"></image> |
|||
</view> |
|||
<view class="t2">{{product.saleing}}人正在参加</view> |
|||
</view> |
|||
|
|||
<view class="shop" v-if="shopset.showjd==1"> |
|||
<image :src="business.logo" class="p1"/> |
|||
<view class="p2 flex1"> |
|||
<view class="t1">{{business.name}}</view> |
|||
<view class="t2">{{business.desc}}</view> |
|||
</view> |
|||
<button class="p4" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}" @tap="goto" :data-url="product.bid==0?'/pages/index/index':'/pages/business/index?id='+product.bid" data-opentype="reLaunch">进入店铺</button> |
|||
</view> |
|||
<view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">商品描述</view><view class="t2"></view><view class="t1"></view></view> |
|||
<view class="detail"> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:70px;"></view> |
|||
|
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':'notabbarbot'" v-if="product.status==1"> |
|||
<view class="f1"> |
|||
<view class="item" @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="item" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
<view class="item flex1" @tap="shareClick"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/share2.png'"/> |
|||
<view class="t1">分享</view> |
|||
</view> |
|||
<view class="item" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="imJoin==0"> |
|||
<view class="tobuy" :style="{background:t('color1')}" v-if="product.starttime > nowtime" style="background:#aaa">活动未开始</view> |
|||
<view class="tobuy" :style="{background:t('color1')}" v-else-if="product.endtime < nowtime" style="background:#aaa">活动已结束</view> |
|||
<view class="tobuy" :style="{background:t('color1')}" @tap="joinin" v-else>立即参与砍价</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="tobuy" :style="{background:t('color1')}" @tap="joinin">查看我的砍价</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image src="https://dev.lansoft.shop/static/img/static/img/close.png" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul + '/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
current: 0, |
|||
indexurl:app.globalData.indexurl, |
|||
platform:app.globalData.platform, |
|||
tabnum: 1, |
|||
num: 1, |
|||
isfavorite: false, |
|||
btntype: 1, |
|||
ggselected: [], |
|||
ks: '', |
|||
gwcnum: 1, |
|||
nodata: 0, |
|||
userinfo: [], |
|||
djsday: '00', |
|||
djshour: '00', |
|||
djsmin: '00', |
|||
djssec: '00', |
|||
product: "", |
|||
business: {}, |
|||
shopset: "", |
|||
pagecontent: "", |
|||
joinlist: "", |
|||
nowtime: "", |
|||
imJoin: "", |
|||
title: "", |
|||
sharepic: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
kfurl:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var id = that.opt.id; |
|||
that.loading = true; |
|||
app.get('ApiKanjia/product', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var product = res.product; |
|||
var business = res.business; |
|||
var pagecontent = JSON.parse(product.detail); |
|||
|
|||
that.product = product; |
|||
that.business = business; |
|||
that.shopset = res.shopset; |
|||
that.pagecontent = pagecontent; |
|||
that.joinlist = res.joinlist; |
|||
that.nowtime = res.nowtime; |
|||
that.imJoin = res.imJoin; |
|||
that.title = product.name; |
|||
that.isfavorite = res.isfavorite; |
|||
that.sharepic = product.pics[0]; |
|||
clearInterval(interval); |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
uni.setNavigationBarTitle({ |
|||
title: product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+res.product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.loaded({title:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current; |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
if (that.product.starttime * 1 > that.nowtime * 1) { |
|||
var totalsec = that.product.starttime * 1 - that.nowtime * 1; |
|||
} else { |
|||
var totalsec = that.product.endtime * 1 - that.nowtime * 1; |
|||
} |
|||
if (totalsec <= 0) { |
|||
that.djsday = '00'; |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djsday = (date < 10 ? '0' : '') + date; |
|||
var djshour = (houer < 10 ? '0' : '') + houer; |
|||
var djsmin = (min < 10 ? '0' : '') + min; |
|||
var djssec = (sec < 10 ? '0' : '') + sec; |
|||
that.djsday = djsday; |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
joinin: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.goto('join?proid=' + proid); |
|||
}, |
|||
//收藏操作 |
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.showLoading('加载中'); |
|||
app.post('ApiKanjia/addfavorite', {proid: proid,type: 'kanjia'}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite; |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
tabClick: function (e) { |
|||
this.tabnum = e.currentTarget.dataset.num; |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiKanjia/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/kanjia/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/kanjia/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 750rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
|
|||
.kanjia_title{ width:100%;height:110rpx;display:flex;align-items:center;} |
|||
.kanjia_title .f1{height:110rpx;background: linear-gradient(90deg,#FF3143,#FE6748);display:flex;flex-direction:column;flex:1;justify-content:center;position:relative;padding-left:20rpx} |
|||
.kanjia_title .f1 .t1{font-size:24rpx;color:#fff} |
|||
.kanjia_title .f1 .t2{font-size:24rpx;color:#fff;} |
|||
.kanjia_title .f1 .t3{background:rgba(255, 255, 255,0.9);height:46prx;line-height:46rpx;border-radius:23rpx;padding:0 20rpx;color:#FF3143;font-size:24rpx;position:absolute;right:10rpx;top:30rpx;} |
|||
.kanjia_title .f3{width:280rpx;height:110rpx;background:#FFDBDF;color:#333;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.kanjia_title .f3 .t2{color:#FF3143} |
|||
.kanjia_title .djsspan{font-size:22rpx;border-radius:8rpx;background:#FF3143;color:#fff;text-align:center;padding:4rpx 8rpx;margin:0 4rpx} |
|||
|
|||
.header {width: 100%;padding: 0 3%;background: #fff;display:flex;flex-direction:column} |
|||
.header .title {padding: 10px 0px;line-height:44rpx;font-size:32rpx;display:flex;} |
|||
.header .title .lef{display:flex;flex-direction:column;justify-content: center;flex:1;color:#222222;font-weight:bold} |
|||
.header .title .lef .t2{ font-size:26rpx;color:#999;padding-top:10rpx;font-weight:normal} |
|||
.header .title .share{width:88rpx;height:88rpx;padding-left:20rpx;border-left:0 solid #f5f5f5;text-align:center;font-size:24rpx;color:#222;display:flex;flex-direction:column;align-items:center} |
|||
.header .title .share image{width:32rpx;height:32rpx;margin-bottom:4rpx} |
|||
.header .sales_stock{display:flex;justify-content:space-between;height:40rpx;line-height:40rpx;margin-bottom:20rpx;font-size:24rpx;color:#777777} |
|||
|
|||
.choose{ display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; height: 80rpx; line-height: 80rpx; padding: 0 3%; color: #505050; } |
|||
.choose .f2{ width: 40rpx; height: 40rpx;} |
|||
|
|||
.joinlist{width:100%;display:flex;align-items:center;margin-top:20rpx;background: #fff;padding:30rpx 3%;} |
|||
.joinlist .t1{margin-left: -10rpx;height:40rpx;} |
|||
.joinlist .t1 image{width:50rpx;height:50rpx;border-radius: 50%;border:2px solid #fff;} |
|||
.joinlist .t2{font-size:24rpx;color:#787878} |
|||
|
|||
|
|||
.shop{display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 100rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:6rpx;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:60rpx;margin-bottom:30rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.bottombar{ width: 94%; position: fixed;bottom: 0px; left: 0px; background: #fff;display:flex;height:100rpx;padding:0 4% 0 2%;align-items:center;box-sizing:content-box} |
|||
.bottombar .f1{flex:1;display:flex;align-items:center;margin-right:30rpx} |
|||
.bottombar .f1 .item{display:flex;flex-direction:column;align-items:center;width:80rpx;position:relative} |
|||
.bottombar .f1 .item .img{ width:44rpx;height:44rpx} |
|||
.bottombar .f1 .item .t1{font-size:18rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .op{width:60%;border-radius:36rpx;overflow:hidden;display:flex;} |
|||
.bottombar .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;display:flex;align-items:center;justify-content:center} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
</style> |
|||
@ -0,0 +1,83 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<form @submit="formSubmit" @reset="formReset" report-submit="true"> |
|||
<view class="form-item"> |
|||
<text class="label">退款原因</text> |
|||
<view class="input-item"><textarea placeholder="请输入退款原因" placeholder-style="color:#999;" name="reason"></textarea></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退款金额(元)</text> |
|||
<view class="flex"><input name="money" type="digit" :value="totalprice" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<button class="ref-btn" form-type="submit">确定</button> |
|||
</form> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderid: '', |
|||
totalprice: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
var that = this; |
|||
that.orderid = that.opt.orderid; |
|||
that.totalprice = that.opt.price; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
formSubmit: function (e) { |
|||
//console.log(e);return; |
|||
var that = this; |
|||
var orderid = that.orderid; |
|||
var reason = e.detail.value.reason; |
|||
var money = parseFloat(e.detail.value.money); |
|||
|
|||
if (reason == '') { |
|||
app.alert('请填写退款原因'); |
|||
return; |
|||
} |
|||
|
|||
if (money <= 0 || money > parseFloat(that.totalprice)) { |
|||
app.alert('退款金额有误'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiKanjia/refund', {orderid: orderid,reason: reason,money: money}, function (data) { |
|||
app.showLoading(false); |
|||
app.alert(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item{ width:100%;background: #fff; padding: 32rpx 20rpx;} |
|||
.form-item .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item .input-item{ width:100%;} |
|||
.form-item textarea{ width:100%;height:200rpx;border: 1px #eee solid;padding: 20rpx;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx} |
|||
.form-item .mid{ height:80rpx;line-height:80rpx;padding:0 20rpx;} |
|||
.ref-btn{ width: 90%; margin: 0 5%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 8px;border: none; background: #ff8758; } |
|||
</style> |
|||
@ -0,0 +1,102 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="wrap" :style="{background:t('color1')}"> |
|||
<view class="top flex" > |
|||
<view class="f1"><text class="t1">{{tkdata.ishg==1?'合格':'不合格'}}</text> |
|||
<text class="t2">{{tkdata.ishg==1?'恭喜您,已通过考试':'请认真学习后再来试一下吧~'}} </text></view> |
|||
<view class="score"><text class="t1">{{tkdata.score}}</text><text class="t2">分</text></view> |
|||
</view> |
|||
<view class="content"> |
|||
<view class="c_1 flex"> |
|||
<view class="f2"><text class="t1">{{tkdata.rightnum}}</text><text class="t2">答对题目</text></view> |
|||
<view class="f2"><text class="t1">{{tkdata.errornum}}</text><text class="t2">答错题目</text></view> |
|||
|
|||
</view> |
|||
<view class="c_2"> |
|||
<view class="list1"><text class="t3">考试时间</text><text class="t4">{{tkdata.time}}</text></view> |
|||
<view class="list1"> <text class="t3">交卷时间</text><text class="t4">{{tkdata.endtime}}</text></view> |
|||
<view class="list1"><text class="t3">答题用时</text><text class="t4">{{tkdata.longtime}}</text></view> |
|||
</view> |
|||
<view v-if="tkdata.ishg==1" class="aginbtn" :style="{background:t('color1')}" @tap="goto" :data-url="'recordlog?kcid='+tkdata.kcid">答题记录</view> |
|||
<view v-if="tkdata.ishg!=1" class="aginbtn" :style="{background:t('color1')}" @tap="goto" :data-url="'tiku?id='+tkdata.kcid">再答一次</view> |
|||
<view class="bottom flex" > |
|||
<view class="btn2" v-if="tkdata.ishg!=1" :style="'width:100%'" @tap="goto" :data-url="'product?id='+tkdata.kcid"> 继续学习</view> |
|||
<view class="btn3" v-if="tkdata.ishg==1 && tkdata.errornum>0" :style="'margin-left:0;width:100%'" @tap="goto" :data-url="'error?rid='+tkdata.id">错题回顾</view> |
|||
<view class="btn3" v-if="tkdata.ishg!=1 && tkdata.errornum>0" :style="'width:100%'" @tap="goto" :data-url="'error?rid='+tkdata.id">错题回顾</view> |
|||
</view> |
|||
</view> |
|||
<view style="height: 130rpx;"></view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
pre_url:app.globalData.pre_url, |
|||
tkdata:[] |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var rid = this.opt.rid || 0; |
|||
that.loading = true; |
|||
app.post('ApiKecheng/complete', {rid:rid}, function (res){ |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
//app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.tkdata = res.data |
|||
that.loaded(); |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
|
|||
}; |
|||
</script> |
|||
<style> |
|||
.wrap{ background: #fff; padding: 30rpx; height: auto;} |
|||
.top{ margin-top: 60rpx; padding: 50rpx; justify-content: space-between;} |
|||
.top .f1 .t1{ display: block; color: #fff; font-size: 44rpx;} |
|||
.top .f1 .t2{ font-size: 26rpx; color:rgba(255,255,255,0.8); margin-top: 30rpx;display: block;} |
|||
.content{ background: #fff; padding: 80rpx; border-radius:20rpx ;} |
|||
.content .c_1{ justify-content: space-between; padding: 0 80rpx;} |
|||
.content .c_1 .f2 text{ display:block } |
|||
.content .c_1 .f2 .t1{ font-size: 64rpx; font-weight: bold; color: #222; text-align: center;} |
|||
.content .c_1 .f2 .t2{ color: #93949E; font-size: 24rpx; margin-top: 20rpx;} |
|||
.content .list1{ line-height: 60rpx;} |
|||
.content .list1 .t3{ font-size: 26rpx; color: #222;} |
|||
.content .list1 .t4{ display: inline-block; margin-left: 40rpx;color: #93949E;} |
|||
.content .c_2{ margin-top: 50rpx;} |
|||
.aginbtn{ margin-top: 80rpx; text-align: center;color: #fff; border-radius:40rpx ; height: 88rpx; line-height: 88rpx; font-size: 32rpx;} |
|||
.top .score{ width: 160rpx; height: 160rpx;} |
|||
.bottom .btn2{ background-color: rgba(255,0,0,0.3); width: 240rpx; color:#FF5347 ; margin-top: 50rpx; height: 88rpx; text-align: center; |
|||
font-weight: bold; font-size: 32rpx; |
|||
line-height: 88rpx;border-radius: 40rpx;} |
|||
.bottom .btn3{ background-color:#EEEEEE; width: 240rpx; color:#222 ; margin-top: 50rpx; height: 88rpx; text-align: center; |
|||
font-weight: bold; font-size: 32rpx; |
|||
line-height: 88rpx;border-radius: 40rpx; margin-left: 30rpx;} |
|||
.score .t1{ color:#fff; font-size: 64rpx;font-weight: bold; text-align: center; display: inline-block; margin-left: 30rpx; margin-top: 20rpx;} |
|||
.score .t2{ color:rgba(255,255,255,0.8);} |
|||
</style> |
|||
@ -0,0 +1,164 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
|
|||
<view class="wrap"> |
|||
<view class="top flex"> |
|||
<view class="f1" v-if="tkdata.type==1 && tkdata.rightcount==1">单选题</view> |
|||
<view class="f1" v-if="tkdata.type==1 && tkdata.rightcount==2">多选题</view> |
|||
<view class="f1" v-if="tkdata.type==2">填空题</view> |
|||
<view class="f3">{{tkdata.sort}}/{{tkdata.nums}}</view> |
|||
</view> |
|||
<view class="question" > |
|||
<view class="title" > |
|||
{{tkdata.sort}}.{{tkdata.title}} |
|||
</view> |
|||
<block v-if="tkdata.type==1 && tkdata.rightcount==1"> |
|||
<view class="option_group" > |
|||
<view :class="'option flex ' +(index==currentindex?'on':'') " v-for="(item, index) in tkdata.option" > |
|||
{{tkdata.sorts[index]}} |
|||
<view class="after" ></view> |
|||
<view class="t1">{{item}}</view></view> |
|||
</view> |
|||
</block> |
|||
<block v-if="tkdata.type==1 && tkdata.rightcount>1"> |
|||
<view class="option_group" > |
|||
<view :class="'option flex '+(isActive.indexOf(index)!=-1?'on':'')" v-for="(item, index) in tkdata.option" @tap="selectOption(index)" :data-index='index'> |
|||
{{tkdata.sorts[index]}} |
|||
<view class="after" ></view> |
|||
<view class="t1">{{item}}</view></view> |
|||
</view> |
|||
</block> |
|||
<block v-if="tkdata.type==1 && !tkdata.rightcount"> |
|||
<view class="option_group" > |
|||
<view :class="'option flex '" v-for="(item, index) in tkdata.option" @tap="selectOption(index)" :data-index='index'> |
|||
{{tkdata.sorts[index]}} |
|||
<view class="after" ></view> |
|||
<view class="t1">{{item}}</view></view> |
|||
</view> |
|||
</block> |
|||
<block v-if="tkdata.type==2"> |
|||
<view class="option_group"> |
|||
<view class="uni-textarea"> |
|||
<textarea placeholder-style="color:#222" placeholder="答:" @blur="bindTextAreaBlur" :value="tkdata.answer"/> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="right_content"> |
|||
<text class="t1">正确答案</text> |
|||
<text class="t2"> |
|||
{{tkdata.type==2?tkdata.right_option:''}} |
|||
{{tkdata.type==1?tkdata.right_options:''}} |
|||
<view >题目解析:{{tkdata.jiexi}}</view> |
|||
</text> |
|||
</view> |
|||
<view class="bottom flex"> |
|||
<block v-if="tkdata.isup!=1"><button class="upbut flex-x-center flex-y-center hui" >上一题</button></block> |
|||
<block v-if="tkdata.isup==1"><button @tap="toanswer" data-dttype="up" class="upbut flex-x-center flex-y-center" :style="{background:t('color1')}" >上一题</button></block> |
|||
<button v-if="tkdata.isdown==1" @tap="toanswer" data-dttype="down" class="downbtn flex-x-center flex-y-center" :style="{background:t('color1')}" >下一题</button> |
|||
<button v-if="tkdata.isdown!=1" class="downbtn flex-x-center flex-y-center hui" >下一题</button> |
|||
</view> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
title: "", |
|||
datalist: [], |
|||
logid:'', |
|||
isActive:[], |
|||
currentindex:'', |
|||
op:'', |
|||
isActive:[], |
|||
right_option:'', |
|||
tkdata:[] |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that =this; |
|||
var id = this.opt.rid || 0; |
|||
that.loading = true; |
|||
app.post('ApiKecheng/error', { rid:id,op:that.op,logid:that.logid}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.tkdata = res.data; |
|||
var answer = []; |
|||
if(that.tkdata.type==1 && res.data.answer.length>0){ |
|||
var answer = res.data.answer; |
|||
answer.map((item) => { |
|||
that.isActive.push(item); |
|||
}) |
|||
that.currentindex = answer; |
|||
}else{ |
|||
that.currentindex = res.data.answer; |
|||
} |
|||
that.logid = res.data.logid |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
toanswer:function(e){ |
|||
var that =this; |
|||
that.op = e.currentTarget.dataset.dttype |
|||
that.isActive=[]; |
|||
that.getdata(); |
|||
}, |
|||
bindTextAreaBlur: function (e) { |
|||
var that=this |
|||
that.right_option = e.detail.value |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.wrap{ background: #fff; margin: 30rpx; border-radius: 10rpx; padding: 30rpx;} |
|||
|
|||
.top{height: 120rpx; line-height: 100rpx; justify-content: space-between;} |
|||
.top .f1{ color:#93949E;font-size: 28rpx;} |
|||
.top .f2{ color:#FF5347 ; font-size: 28rpx;} |
|||
.top .f3{ color:#93949E ; font-size: 28rpx;} |
|||
.question .title{ font-size: 30rpx; color: #333; font-weight: bold;} |
|||
|
|||
.right_content{ background: #fff; margin: 30rpx; border-radius: 10rpx; padding: 30rpx;} |
|||
.right_content .t1{ color: #333; font-weight: 30rpx; font-weight: bold; display: block; margin-bottom: 20rpx;} |
|||
.right_content .t2{ color:#93949E;font-size: 26rpx;} |
|||
|
|||
.option_group .option{ position: relative; padding-left: 37rpx; height: 96rpx; line-height: 96rpx; background:#F8F4F4 ; margin-top: 30rpx; border-radius: 48rpx; } |
|||
.option_group .option .t1{ margin-left: 40rpx;} |
|||
.option_group .option.on{ background: #FDF1F1; color:#FF5347 ; border: 1px solid #FFAEA8;} |
|||
.option_group .option.on .after{ border:1px solid #FF8D8D; } |
|||
.option_group .option.green{ background:#36CF7B ; color:#fff} |
|||
.option_group .option.green .after{ border:1px solid #fff;} |
|||
.option_group .option .after{ border:1px solid #BBB; height:29rpx; position: absolute;left: 12%; margin-top: 35rpx;} |
|||
.bottom .upbut{width:240rpx;height: 88rpx; line-height: 88rpx;color: #fff; border-radius: 44rpx;border: none;font-size:28rpx;font-weight:bold; background: #FD4A46; } |
|||
.bottom .upbut.hui{ background: #E3E3E3;} |
|||
.bottom .downbtn{margin-left:50rpx;width:360rpx;height: 88rpx; border-radius: 44rpx; line-height: 72rpx;color: #fff; border: none;font-size:28rpx;font-weight:bold; background: #FD4A46; } |
|||
.bottom .downbtn.hui{ background: #E3E3E3;} |
|||
.bottom{ margin-top: 30rpx; padding: 30rpx;} |
|||
.uni-textarea{ margin-top: 30rpx; background: #FAFAFA; border: 1px solid #EBE5E5;border-radius: 8rpx; padding: 30rpx;} |
|||
</style> |
|||
@ -0,0 +1,335 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="search-container" :style="history_show?'height:100%;':''"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<text class="iconfont icon-search"></text> |
|||
<input :value="keyword" placeholder="商品搜索..." placeholder-style="font-size:24rpx;color:#FFFFFF" @confirm="searchConfirm" @input="searchChange" /> |
|||
</view> |
|||
<view class="search-btn" @tap="searchbtn"> |
|||
<text class="iconfont icon-pailie" v-if="!history_show && productlisttype=='itemlist'"></text> |
|||
<text class="iconfont icon-shipailie" v-if="!history_show && productlisttype=='item2'"></text> |
|||
<text v-if="history_show">搜索</text> |
|||
</view> |
|||
</view> |
|||
<view class="search-history" v-show="history_show"> |
|||
<view> |
|||
<text class="search-history-title">最近搜索</text> |
|||
<view class="delete-search-history" @tap="deleteSearchHistory"> |
|||
<image :src="event_rul + '/static/img/static/img/del.png'" style="width:36rpx;height:36rpx"/> |
|||
</view> |
|||
</view> |
|||
<view class="search-history-list"> |
|||
<view v-for="(item, index) in history_list" :key="index" class="search-history-item" :data-value="item" @tap="historyClick">{{item}} |
|||
</view> |
|||
<view v-if="!history_list || history_list.length==0" class="flex-y-center"><image :src="event_rul + '/static/img/static/img/tanhao.png'" style="width:36rpx;height:36rpx;margin-right:10rpx"/>暂无记录 </view> |
|||
</view> |
|||
</view> |
|||
<view class="search-navbar" v-show="!history_show"> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" :style="(!field||field=='sort')?'color:'+t('color1'):''" data-field="sort" data-order="desc">综合</view> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" :style="field=='readnum'?'color:'+t('color1'):''" data-field="readnum" data-order="desc">浏览量</view> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" data-field="price" :data-order="order=='asc'?'desc':'asc'"> |
|||
<text :style="field=='price'?'color:'+t('color1'):''">价格</text> |
|||
<text class="iconfont icon-danbianjiantou1" :style="field=='price'&&order=='asc'?'color:'+t('color1'):''"></text> |
|||
<text class="iconfont icon-danbianjiantou" :style="field=='price'&&order=='desc'?'color:'+t('color1'):''"></text> |
|||
</view> |
|||
<view class="search-navbar-item flex-x-center flex-y-center" @click.stop="showDrawer('showRight')">筛选 <text :class="'iconfont iconshaixuan ' + (showfilter?'active':'')"></text></view> |
|||
</view> |
|||
<uni-drawer ref="showRight" mode="right" @change="change($event,'showRight')" :width="280"> |
|||
<view class="filter-scroll-view"> |
|||
<scroll-view class="filter-scroll-view-box" scroll-y="true"> |
|||
<view class="search-filter"> |
|||
<view class="filter-title">筛选</view> |
|||
<view class="filter-content-title">课程分类</view> |
|||
<view class="search-filter-content"> |
|||
<view class="filter-item" :style="catchecid==oldcid?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.1)':''" @tap.stop="cateClick" :data-cid="oldcid">全部</view> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<view class="filter-item" :style="catchecid==item.id?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.1)':''" @tap.stop="cateClick" :data-cid="item.id">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
<view class="search-filter-btn"> |
|||
<view class="btn" @tap="filterReset">重置</view> |
|||
<view class="btn2" :style="{background:t('color1')}" @tap="filterConfirm">确定</view> |
|||
</view> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
</uni-drawer> |
|||
|
|||
|
|||
</view> |
|||
<view class="product-container"> |
|||
<block v-if="datalist && datalist.length>0"> |
|||
<dp-kecheng-item v-if="productlisttype=='item2'" :data="datalist" :menuindex="menuindex"></dp-kecheng-item> |
|||
<dp-kecheng-itemlist v-if="productlisttype=='itemlist'" :data="datalist" :menuindex="menuindex"></dp-kecheng-itemlist> |
|||
</block> |
|||
<nomore text="没有更多课程了" v-if="nomore"></nomore> |
|||
<nodata text="没有查找到相关课程" v-if="nodata"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
nomore:false, |
|||
nodata:false, |
|||
keyword: '', |
|||
pagenum: 1, |
|||
datalist: [], |
|||
history_list: [], |
|||
history_show: false, |
|||
order: '', |
|||
field:'', |
|||
oldcid: "", |
|||
catchecid: "", |
|||
catchegid: "", |
|||
cid: "", |
|||
gid: '', |
|||
clist: [], |
|||
glist: [], |
|||
productlisttype: 'item2', |
|||
showfilter: "", |
|||
cpid:0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.oldcid = this.opt.cid || ''; |
|||
this.catchecid = this.opt.cid; |
|||
this.cid = this.opt.cid; |
|||
this.gid = this.opt.gid; |
|||
this.cpid = this.opt.cpid || 0; |
|||
if(this.cpid > 0){ |
|||
uni.setNavigationBarTitle({ |
|||
title: '可用商品列表' |
|||
}); |
|||
} |
|||
var productlisttype = app.getCache('productlisttype'); |
|||
if (productlisttype) this.productlisttype = productlisttype; |
|||
this.history_list = app.getCache('search_history_list'); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getprolist(); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
var cid = that.opt.cid; |
|||
var gid = that.opt.gid; |
|||
var bid = that.opt.bid ? that.opt.bid : ''; |
|||
that.loading = true; |
|||
app.get('ApiKecheng/list', {cid: cid,gid: gid,bid:bid}, function (res) { |
|||
that.loading = false; |
|||
that.clist = res.clist; |
|||
that.glist = res.glist; |
|||
that.loaded(); |
|||
that.getprolist(); |
|||
}); |
|||
}, |
|||
getprolist: function () { |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
var order = that.order; |
|||
var field = that.field; |
|||
var gid = that.gid; |
|||
var cid = that.cid; |
|||
var cpid = that.cpid; |
|||
that.history_show = false; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
var bid = that.opt.bid ? that.opt.bid : ''; |
|||
app.post('ApiKecheng/getlist',{pagenum: pagenum,keyword: keyword,field: field,order: order,gid: gid,cid: cid,cpid:cpid,bid:bid}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
// 打开窗口 |
|||
showDrawer(e) { |
|||
console.log(e) |
|||
this.$refs[e].open() |
|||
}, |
|||
// 关闭窗口 |
|||
closeDrawer(e) { |
|||
this.$refs[e].close() |
|||
}, |
|||
// 抽屉状态发生变化触发 |
|||
change(e, type) { |
|||
console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭')); |
|||
this[type] = e |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
if (e.detail.value == '') { |
|||
this.history_show = true; |
|||
this.datalist = []; |
|||
} |
|||
}, |
|||
searchbtn: function () { |
|||
var that = this; |
|||
if (that.history_show) { |
|||
var keyword = that.keyword; |
|||
that.searchproduct(); |
|||
} else { |
|||
if (that.productlisttype == 'itemlist') { |
|||
that.productlisttype = 'item2'; |
|||
app.setCache('productlisttype', 'item2'); |
|||
} else { |
|||
that.productlisttype = 'itemlist'; |
|||
app.setCache('productlisttype', 'itemlist'); |
|||
} |
|||
} |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.searchproduct(); |
|||
}, |
|||
searchproduct: function () { |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
that.addHistory(); |
|||
that.getprolist(); |
|||
}, |
|||
sortClick: function (e) { |
|||
var that = this; |
|||
var t = e.currentTarget.dataset; |
|||
that.field = t.field; |
|||
that.order = t.order; |
|||
that.searchproduct(); |
|||
}, |
|||
groupClick: function (e) { |
|||
var that = this; |
|||
var gid = e.currentTarget.dataset.gid; |
|||
if(gid === true) gid = ''; |
|||
that.catchegid = gid |
|||
}, |
|||
cateClick: function (e) { |
|||
var that = this; |
|||
var cid = e.currentTarget.dataset.cid; |
|||
if(cid === true) cid = ''; |
|||
that.catchecid = cid |
|||
}, |
|||
filterConfirm(){ |
|||
this.cid = this.catchecid; |
|||
this.gid = this.catchegid; |
|||
this.searchproduct(); |
|||
this.$refs['showRight'].close() |
|||
}, |
|||
filterReset(){ |
|||
this.catchecid = this.oldcid; |
|||
this.catchegid = ''; |
|||
}, |
|||
filterClick: function () { |
|||
this.showfilter = !this.showfilter |
|||
}, |
|||
addHistory: function () { |
|||
var that = this; |
|||
var keyword = that.keyword; |
|||
if (app.isNull(keyword)) return; |
|||
var historylist = app.getCache('search_history_list'); |
|||
if (app.isNull(historylist)) historylist = []; |
|||
historylist.unshift(keyword); |
|||
var newhistorylist = []; |
|||
for (var i in historylist) { |
|||
if (historylist[i] != keyword || i == 0) { |
|||
newhistorylist.push(historylist[i]); |
|||
} |
|||
} |
|||
if (newhistorylist.length > 5) newhistorylist.splice(5, 1); |
|||
app.setCache('search_history_list', newhistorylist); |
|||
that.history_list = newhistorylist |
|||
}, |
|||
historyClick: function (e){ |
|||
var that = this; |
|||
var keyword = e.currentTarget.dataset.value; |
|||
if (keyword.length == 0) return; |
|||
that.keyword = keyword; |
|||
that.searchproduct(); |
|||
}, |
|||
deleteSearchHistory: function () { |
|||
var that = this; |
|||
that.history_list = null; |
|||
app.removeCache("search_history_list"); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang="scss"> |
|||
.container {background: #F5F5F5;height: 100vh;} |
|||
.search-container {position: fixed;width: 100%;z-index:9;top:var(--window-top);background: #0A5D3B;} |
|||
.topsearch{width:100%;padding:16rpx 20rpx;} |
|||
.topsearch .f1{height: 80rpx;border-radius: 40rpx;border: 0;background: rgba(255,255,255,.3);flex:1;padding: 0 28rpx;} |
|||
.topsearch .f1 .icon-search{font-size: 40rpx;margin-right: 16rpx;color:#FFFFFF;} |
|||
.topsearch .f1 input{height: 100%;flex: 1;font-size: 28rpx;color:#FFFFFF;} |
|||
.topsearch .search-btn{ |
|||
display:flex;align-items:center;color:#FFFFFF;text-align:center;margin-left:20rpx; |
|||
.iconfont {font-size:40rpx;} |
|||
} |
|||
.search-navbar {border-radius: 12rpx 12rpx 0 0;overflow: hidden;background: #F5F5F5;display: flex;text-align: center;align-items:center;padding:32rpx 0} |
|||
.search-navbar-item {flex: 1;height: 28rpx;line-height: 28rpx;position: relative;font-size:28rpx;font-weight:bold;color:#333333} |
|||
|
|||
.search-navbar-item .icon-danbianjiantou,.icon-danbianjiantou1{font-size: 28rpx;color:#7D7D7D} |
|||
.search-navbar-item .icon-danbianjiantou {margin-left: -10rpx;} |
|||
.search-navbar-item .iconshaixuan{margin-left:10rpx;font-size:22rpx;color:#7d7d7d} |
|||
.search-history {padding: 24rpx 34rpx;} |
|||
.search-history .search-history-title {color: #666;} |
|||
.search-history .delete-search-history {float: right;padding: 15rpx 20rpx;margin-top: -15rpx;} |
|||
.search-history-list {padding: 24rpx 0 0 0;} |
|||
.search-history-list .search-history-item {display: inline-block;height: 50rpx;line-height: 50rpx;padding: 0 20rpx;margin: 0 10rpx 10rpx 0;background: #ddd;border-radius: 10rpx;font-size: 26rpx;} |
|||
|
|||
.filter-scroll-view{margin-top:var(--window-top)} |
|||
.search-filter{display: flex;flex-direction: column;text-align: left;width:100%;flex-wrap:wrap;padding:0;} |
|||
.filter-content-title{color:#999;font-size:28rpx;height:30rpx;line-height:30rpx;padding:0 30rpx;margin-top:30rpx;margin-bottom:10rpx} |
|||
.filter-title{color:#BBBBBB;font-size:32rpx;background:#F8F8F8;padding:60rpx 0 30rpx 20rpx;} |
|||
.search-filter-content{display: flex;flex-wrap:wrap;padding:10rpx 20rpx;} |
|||
.search-filter-content .filter-item{min-width: 140rpx;box-sizing: border-box;background:#F4F4F4;border-radius:28rpx;color:#2B2B2B;font-weight:bold;margin:10rpx 10rpx;min-width:140rpx;height:56rpx;line-height:56rpx;text-align:center;font-size: 24rpx;padding:0 20rpx} |
|||
.search-filter-content .close{text-align: right;font-size:24rpx;color:#ff4544;width:100%;padding-right:20rpx} |
|||
.search-filter button .icon{margin-top:6rpx;height:54rpx;} |
|||
.search-filter-btn{display:flex;padding:30rpx 30rpx;justify-content: space-between} |
|||
.search-filter-btn .btn{width:240rpx;height:66rpx;line-height:66rpx;background:#fff;border:1px solid #e5e5e5;border-radius:33rpx;color:#2B2B2B;font-weight:bold;font-size:24rpx;text-align:center} |
|||
.search-filter-btn .btn2{width:240rpx;height:66rpx;line-height:66rpx;border-radius:33rpx;color:#fff;font-weight:bold;font-size:24rpx;text-align:center} |
|||
|
|||
.product-container {width: 100%;font-size:26rpx;padding:206rpx 24rpx 0;} |
|||
</style> |
|||
@ -0,0 +1,398 @@ |
|||
<template> |
|||
<view class="wrap"> |
|||
<block v-if="isload"> |
|||
<block v-if="detail.kctype==1"> |
|||
<view class="title">{{detail.name}}</view> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
<view style="margin-bottom: 40rpx;"></view> |
|||
</block> |
|||
<view class="audo-video" v-if="detail.kctype==2"> |
|||
<view class="audoimg"><image :src="detail.pic"/></view> |
|||
<view class="play"> |
|||
<view class="play-left"> |
|||
<image :src="event_rul + '/static/img/static/img/video_icon.png'" v-show="playshow" @tap="play"></image> |
|||
<image :src="event_rul + '/static/img/static/img/play.png'" v-show="!playshow" @tap="pauseaudio"></image> |
|||
<text>{{nowtime}}</text> |
|||
</view> |
|||
<view class="play-right"> |
|||
<slider @change="sliderChange" @changing="sliderChanging" class="slider" block-size="16" :min="0" :max="time" :value="currentTime" activeColor="#595959" /> |
|||
</view> |
|||
<view class="play-end"><text>{{duration}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="videobox" v-if="detail.kctype==3"> |
|||
<video class="video" id="video" :autoplay="true" :src="detail.video_url" :initial-time="detail.startTime" @pause="pause" @timeupdate="timeupdate"></video> |
|||
</view> |
|||
<view style=" height: 30rpx; width: 100%; background-color: #f5f5f5;"></view> |
|||
<view class="content_box"> |
|||
<view class="title flex"> |
|||
<view class="t1">课程目录</view> |
|||
<view class="t2" v-if="detail.isdt==1 && detail.count>=detail.kccount && iskaoshi!=1" @tap.stop="goto" :data-url="'tiku?id=' + detail.kcid" data-opentype="redirect">去答题</view> |
|||
<view class="t2" v-if="iskaoshi==1" @tap.stop="goto" :data-url="'recordlog?kcid=' + detail.kcid">答题记录</view> |
|||
</view> |
|||
<view class="mulubox flex" v-for="(item, index) in datalist" :key="index" > |
|||
<view class="left_box"> |
|||
<image v-if="item.kctype==1" :src="event_rul + '/static/img/static/img/tw_icon.png'" /> |
|||
<image v-if="item.kctype==2" :src="event_rul + '/static/img/static/img/mp3_icon.png'" /> |
|||
<image v-if="item.kctype==3" :src="event_rul + '/static/img/static/img/video_icon.png'" /> |
|||
</view> |
|||
<view class="right_box flex"> |
|||
<view :class="'title_box '+ (item.id==detail.id?'on':'')" @tap="todetail" :data-key='item.key' :data-mianfei='item.ismianfei' :data-url="'mldetail?id='+item.id+'&kcid='+item.kcid" :data-opentype="item.kctype==1 ? 'redirect' : 'redirect'"> |
|||
<view class="t1"> {{item.name}}</view> |
|||
<view> |
|||
<text v-if="item.kctype==1" class="t2">图文课程 </text> |
|||
<text v-if="item.kctype==2" class="t2">音频课程 </text> |
|||
<text v-if="item.kctype==3" class="t2">视频课程 </text> |
|||
<text class="t2" v-if="item.video_duration>0"> 时长: {{item.duration}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="jindu" v-if="item.jindu">{{item.jindu}}%</view> |
|||
<view class="skbtn" v-if="item.ismianfei && !item.jindu">试看</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nomore text="没有更多课程了" v-if="nomore"></nomore> |
|||
<nodata text="没有查找到相关课程" v-if="nodata"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
loading:false, |
|||
isload: false, |
|||
isplay: 0, |
|||
detail: [], |
|||
datalist: [], |
|||
pagecontent: "", |
|||
playshow:true, //播放的图片 |
|||
stipshow:false, //暂停的图片 |
|||
lock: false, // 锁 |
|||
status: 1, // 1暂停 2播放 |
|||
currentTime: 10, //当前进度 |
|||
duration: '', // 总进度 |
|||
videoContext: '', |
|||
iskaoshi:'', |
|||
pagenum:1, |
|||
studlog:[], |
|||
innerAudioContext: '', |
|||
startTime:'', |
|||
seek: false ,//是否处于拖动状态 |
|||
time:'', |
|||
playJd:'', |
|||
nowtime:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
this.getdatalist(); |
|||
this.innerAudioContext = uni.createInnerAudioContext(); |
|||
}, |
|||
onShow:function(){ |
|||
var that=this |
|||
clearInterval(interval); |
|||
this.innerAudioContext.stop(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
var that=this |
|||
this.innerAudioContext.stop(); |
|||
}, |
|||
onHide(){ |
|||
this.playshow = false |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdatalist(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var id = this.opt.id || 0; |
|||
that.id = id; |
|||
var kcid = this.opt.kcid || 0; |
|||
that.loading = true; |
|||
app.get('ApiKecheng/mldetail', {id: id,kcid:kcid}, function (res) { |
|||
that.loading = false; |
|||
var detail = res.detail; |
|||
that.detail = detail; |
|||
that.iskaoshi = res.iskaoshi; |
|||
uni.setNavigationBarTitle({ |
|||
title: detail.name |
|||
}); |
|||
that.studylog = res.studylog; |
|||
var pagecontent = JSON.parse(detail.detail); |
|||
that.pagecontent = pagecontent; |
|||
that.loaded({title:detail.name,pic:detail.pic}); |
|||
//that.addstudy(); |
|||
if(detail.kctype>1){ |
|||
interval = setInterval(function () { |
|||
that.addstudy(); |
|||
}, 10000); |
|||
} |
|||
that.play(); |
|||
|
|||
|
|||
}); |
|||
}, |
|||
todetail:function(e){ |
|||
var that = this; |
|||
var url = e.currentTarget.dataset.url; |
|||
var ismf = e.currentTarget.dataset.mianfei; |
|||
var opentype = e.currentTarget.dataset.opentype; |
|||
var key = e.currentTarget.dataset.key; |
|||
if(ismf==1 || that.detail.ispay==1 || that.detail.price==0){ |
|||
app.goto(url,opentype); |
|||
}else{ |
|||
app.alert('请先购买课程',function(){ |
|||
app.goto('product?id='+that.opt.kcid); |
|||
}); |
|||
} |
|||
}, |
|||
getdatalist: function(loadmore){ |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var kcid = that.opt.kcid ? that.opt.kcid : ''; |
|||
var order = that.order; |
|||
var field = that.field; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiKecheng/getmululist', {pagenum: pagenum,field: field,order: order,id:kcid}, function (res) { |
|||
that.loading = false; |
|||
uni.stopPullDownRefresh(); |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
|
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
|
|||
}); |
|||
}, |
|||
scrolltolower: function () { |
|||
if (!this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdatalist(true); |
|||
} |
|||
}, |
|||
payvideo: function () { |
|||
this.isplay = 1; |
|||
uni.createVideoContext('video').play(); |
|||
}, |
|||
parsevideo: function () { |
|||
this.isplay = 0; |
|||
uni.createVideoContext('video').stop(); |
|||
}, |
|||
pause:function(){ |
|||
//将暂停播放时间请求 |
|||
var that = this |
|||
var id = that.opt.id ? that.opt.id : ''; |
|||
that.addstudy(); |
|||
}, |
|||
addstudy:function(){ |
|||
var that = this |
|||
var logid = that.studylog.id; |
|||
var id= that.detail.id; |
|||
|
|||
app.post('ApiKecheng/addstudy', {logid:logid,currentTime:that.currentTime,playJd:that.playJd}, function (res) { |
|||
that.datalist[that.detail.key].jindu = res.jindu |
|||
that.detail.startTime = that.currentTime |
|||
if(that.playJd>=100){ |
|||
app.confirm('本节已学完,是否学习下一节', function (res) { |
|||
app.post('ApiKecheng/nextsection', {id: id,kcid:that.detail.kcid}, function (res) { |
|||
app.goto('/activity/kecheng/mldetail?id='+res.id+'&kcid='+that.detail.kcid); |
|||
}); |
|||
}, |
|||
function (res) { |
|||
that.stipshow=false; |
|||
that.playshow=true; |
|||
that.currentTime = 0; |
|||
that.nowtime = '00:00'; |
|||
that.playJd = '0'; |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
timeupdate:function(e){ |
|||
//跳转到指定播放位置 initial-time 时间为秒 |
|||
let that = this; |
|||
//播放的总时长 |
|||
var duration = e.detail.duration; |
|||
//实时播放进度 秒数 |
|||
var currentTime = e.detail.currentTime; |
|||
//当前视频进度 |
|||
// console.log("视频播放到第" + currentTime + "秒")//查看正在播放时间,以秒为单位 |
|||
var jump_time = that.currentTime //上次结束时间 |
|||
|
|||
if (that.detail.isjinzhi == 1) { |
|||
if (currentTime > jump_time && currentTime - jump_time > 1 && that.datalist[that.detail.key].jindu!='100%') { |
|||
let videoContext = wx.createVideoContext('video'); |
|||
videoContext.seek(that.currentTime); |
|||
wx.showToast({ |
|||
title: '未完整看完该视频,不能快进', |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}); |
|||
} |
|||
} |
|||
that.currentTime = currentTime; //实时播放进度 |
|||
}, |
|||
// 播放 |
|||
play() { |
|||
var that=this |
|||
this.playshow=true; |
|||
this.innerAudioContext.autoplay = true; |
|||
this.innerAudioContext.src = that.detail.voice_url; |
|||
this.innerAudioContext.play(); |
|||
this.innerAudioContext.onCanplay(()=> { |
|||
this.innerAudioContext.duration; |
|||
setTimeout(() => { |
|||
that.time = this.innerAudioContext.duration.toFixed(0); |
|||
var min = Math.floor(that.time/60); |
|||
var second = that.time%60 |
|||
this.duration = (min>10?min:'0'+min)+':'+(second>10?second:'0'+second); |
|||
}, 1000) |
|||
}) |
|||
console.log(this.duration); |
|||
that.startTime = that.detail.startTime |
|||
if(that.detail.startTime >=that.detail.video_duration){ |
|||
that.startTime = 0 |
|||
} |
|||
this.innerAudioContext.seek(that.startTime) |
|||
this.innerAudioContext.onPlay(() => { |
|||
that.playshow=false; |
|||
}); |
|||
this.innerAudioContext.onPause(() => { |
|||
//that.addstudy(); |
|||
that.playshow=true; |
|||
}); |
|||
this.innerAudioContext.onEnded(() => { |
|||
that.playJd = 100; |
|||
clearInterval(interval); |
|||
console.log(that.playJd) |
|||
that.addstudy(); |
|||
that.playshow=true; |
|||
}); |
|||
this.innerAudioContext.onTimeUpdate(() => { |
|||
var nowtime = this.innerAudioContext.currentTime.toFixed(0) |
|||
console.log(nowtime); |
|||
var min = Math.floor(nowtime/60) |
|||
var second = nowtime%60 |
|||
that.nowtime = (min>=10?min:'0'+min)+':'+(second>=10?second:'0'+second) |
|||
//计算进度 |
|||
that.playJd = ((nowtime/that.innerAudioContext.duration).toFixed(2))*100; |
|||
if(that.playJd>100) that.playJd=100 |
|||
that.currentTime = this.innerAudioContext.currentTime; |
|||
// console.log(that.currentTime); |
|||
//console.log('播放进度',that.innerAudioContext.currentTime,) |
|||
}); |
|||
|
|||
|
|||
}, |
|||
// 暂停 |
|||
pauseaudio() { |
|||
var that=this |
|||
this.innerAudioContext.pause(); |
|||
that.addstudy(); |
|||
}, |
|||
// 拖动进度条 |
|||
sliderChange(data) { |
|||
var that=this; |
|||
if(that.detail.isjinzhi == 1 && data.detail.value>that.detail.startTime && that.datalist[that.detail.key].jindu!='100'){ |
|||
app.error('未完整听完该音频,不能快进');return; |
|||
}else{ |
|||
that.currentTime = data.detail.value; |
|||
this.innerAudioContext.seek(data.detail.value) |
|||
} |
|||
}, |
|||
//拖动中 |
|||
sliderChanging(data) { |
|||
this.currentTime = data.detail.value |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.wrap{ background: #fff;} |
|||
.wrap .title{ padding: 30rpx; font-size: 42rpx; color: #111111; font-weight: bold; justify-content: space-between;} |
|||
|
|||
.hide{ display: none;} |
|||
.provideo{border-radius:27rpx;width:750rpx;position:absolute;z-index:1000;align-items:center;justify-content:space-between} |
|||
.provideo image{ width: 100%;} |
|||
.provideo .txt{flex:1;text-align:center;padding-left:10rpx;font-size:24rpx;color:#333} |
|||
.videobox{width:100%;text-align:center;background:#000; } |
|||
.videobox .video{width:100%;} |
|||
.videobox .parsevideo{margin:0 auto;margin-top:20rpx;height:40rpx;line-height:40rpx;color:#333;background:#ccc;width:140rpx;border-radius:25rpx;font-size:24rpx} |
|||
|
|||
.content_box{ background: #fff;} |
|||
.content_box .title{ line-height: 60rpx; margin-left: 30rpx; padding:20rpx 0rpx;border-bottom: 1px solid #F7F7F7;} |
|||
.content_box .title .t1{ font-size: 32rpx; font-weight: bold; } |
|||
.content_box .title .t2{ font-size: 24rpx; background:#fff;border:1px solid #cdcdcd;border-radius:3px; margin-right: 20rpx; padding: 0rpx 20rpx; border-radius: 10rpx;} |
|||
.mulubox{ padding-top: 35rpx; padding-left: 30rpx;} |
|||
.left_box{ display: flex;} |
|||
.left_box image{ width: 44rpx; height:44rpx; margin-right: 40rpx; margin-top: 26rpx; } |
|||
.right_box{ border-bottom: 1px solid #F6F6F6; padding-bottom: 30rpx; width: 100%; justify-content: space-between;} |
|||
.title_box{ width: 80%;} |
|||
.title_box .t1{ color: #1E252F; font-size: 28rpx; font-weight: bold;} |
|||
.title_box .t2{ color: #B8B8B8;font-size: 24rpx;line-height: 60rpx; margin-right: 15rpx;} |
|||
.right_box .on text{ color:#FF5347} |
|||
.right_box .on .t1{ color:#FF5347} |
|||
.skbtn{ background-color: #FFEEEC; padding: 6rpx 20rpx; margin-right: 10px; height: 44rpx; width: 90rpx; color: #FC6D65; font-size: 24rpx; border-radius: 22rpx; margin-top: 20rpx;} |
|||
.right_box .jindu{ color:#FF5347; margin-right: 20rpx; font-size: 24rpx;} |
|||
.baner{ width:100%; overflow: hidden; box-sizing: border-box; position: relative;} |
|||
.audioBg{display: block; width:100%; height:370rpx;} |
|||
.transmit{ position: absolute; left: 0; right: 0; top: 0; bottom:0; margin: auto; display: block; width:80rpx; height:80rpx;} |
|||
|
|||
.content { padding: 20upx;} |
|||
.list {font-size: 28upx;line-height: 88upx;padding-left: 30upx;background: #fff;border-radius: 10upx;margin-top: 20upx;color: #333;} |
|||
.active { background: #169af3;color: #fff;} |
|||
|
|||
/*音频播放器样式*/ |
|||
.audoimg{ width: 100%; } |
|||
.audoimg image{ width: 100%; height: 600rpx; } |
|||
/deep/.uni-slider-handle-wrapper{ |
|||
background: black !important; |
|||
} |
|||
/deep/.uni-slider-thumb{ |
|||
background: black !important; |
|||
} |
|||
.play{ background-color:rgba(255,255,255,0.5);width: 100%; height: 124rpx;position: absolute; bottom:0%; } |
|||
.play-left text{ margin-top: 1px; color: black; font-size: 13px; line-height: 120rpx; position: absolute; left: 13%; } |
|||
.play-end text{ margin-top: 1px; color: black; font-size: 13px; line-height: 120rpx; right: 8%; position: absolute; } |
|||
.slider{ width: 366rpx; position: relative; margin-top: 42rpx; color: black; float: left;} |
|||
.musions{ width: 26px; height: 26px; margin: 17px 4px 0 5px; float: left; } |
|||
.play image{ width: 26px; height: 26px; margin: 34rpx 4px 0 5px;float: left; } |
|||
.play-left{width: 170rpx;height: 116upx; float: left; border-radius: 38px; } |
|||
.play-right{ width: 66%; float: left; height: 58px; position: relative; } |
|||
.audo-video { width: 100%; position: relative; top: -18px; } |
|||
.slider-box { display: flex; align-items: center;justify-content: center;font-size: 26upx; color: #999; } |
|||
button { display: inline-block; width: 100upx; background-color: #fff; font-size: 24upx; color: #000; padding: 0; } |
|||
.hidden {position: fixed; z-index: -1; width: 1upx;height: 1upx;} |
|||
</style> |
|||
@ -0,0 +1,158 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="输入课程标题搜索" placeholder-style="font-size:24rpx;color:#C2C2C2" @confirm="searchConfirm" @input="searchChange"></input> |
|||
</view> |
|||
</view> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap.stop="goto" :data-url="'product?id=' + item.kcid"> |
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item.kcid"> |
|||
<image :src="item.pic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.title}}</text> |
|||
<view class="t4 flex"> |
|||
<view> |
|||
<view class="t3"><text class="x1 flex1">{{item.price==0?'免费':'支付金额:¥' + item.price}}</text></view> |
|||
<view class="t2"><text>共{{item.kccount}}节 已学{{item.count}}节</text></view> |
|||
</view> |
|||
<view v-if="item.iskaoshi!=1 && item.count>=item.kccount && item.isdt==1" @tap.stop="goto" :data-url="'tiku?id=' + item.kcid" class="btn2">去答题</view> |
|||
<view v-if="item.iskaoshi!=1 && item.count<item.kccount" @tap.stop="goto" :data-url="'product?id=' + item.kcid" class="btn2">继续学习</view> |
|||
<view v-if="item.iskaoshi==1" @tap.stop="goto" :data-url="'recordlog?kcid=' + item.kcid" class="btn2">答题记录</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
codtxt: "", |
|||
keyword:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var keyword = that.keyword; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiKecheng/orderlist', {keyword: keyword,st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword; |
|||
that.getdata(); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;} |
|||
.topsearch{width:94%;margin:16rpx 3%;} |
|||
.topsearch .f1{height:60rpx;border-radius:30rpx;border:0;background-color:#fff;flex:1} |
|||
.topsearch .f1 .img{width:24rpx;height:24rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
|
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
|
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width:200rpx; height: 200rpx; border-radius: 10rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 22rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246; margin-top: 30rpx;} |
|||
.order-box .content .detail .t4{display:flex;justify-content: space-between; } |
|||
.order-box .content .detail .btn2{ margin-top: 40rpx;} |
|||
|
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
/*.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px; font-size: 14px; position: absolute; bottom: 10px; right: 10px; background: #fff; }*/ |
|||
.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px;} |
|||
|
|||
.zan-tex{clear:both; display: block; width: 100%; color: #565656; font-size: 12px; height: 30px; line-height: 30px; text-align: center; } |
|||
.ind-bot{ width: 100%; float: left; text-align: center; height: 50px; line-height: 50px; font-size: 13px; color: #ccc; background:#F2F2F2} |
|||
</style> |
|||
@ -0,0 +1,548 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="swiper-container" > |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="500000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{(product.pics).length}}</view> |
|||
</view> |
|||
|
|||
<view class="header"> |
|||
<view class="price_share"> |
|||
<view class="title">{{product.name}}</view> |
|||
|
|||
</view> |
|||
<view class="pricebox flex"> |
|||
<view class="price"> |
|||
<view class="f1" v-if="product.price>0" :style="{color:t('color1')}"> |
|||
¥<text style="font-size:36rpx">{{product.price}}</text> |
|||
</view> |
|||
<view class="f1" v-else :style="{color:t('color1')}"> |
|||
<text style="font-size:36rpx">免费</text> |
|||
</view> |
|||
<view class="f2" v-if="product.market_price*1 > product.sell_price*1">¥{{product.market_price}}<text v-if="product.max_price!=product.min_price">起</text></view> |
|||
</view> |
|||
<view class="sales_stock"> |
|||
<view class="f1" >{{product.count}}节课 | 已有{{product.join_num}}人学习 </view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="detail"> |
|||
<view class="detail_title"> |
|||
<view class="order-tab2"> |
|||
<view :class="'item ' + (curTopIndex == 1 ? 'on' : '')" @tap="switchTopTab" :data-index="1" >课程介绍<view class="after" :style="{background:t('color1')}"></view></view> |
|||
<view :class="'item ' + (curTopIndex == 2 ? 'on' : '')" @tap="switchTopTab" :data-index="2" >课程目录<view class="after" :style="{background:t('color1')}"></view></view> |
|||
</view> |
|||
</view> |
|||
<block v-if="curTopIndex==1"><dp :pagecontent="pagecontent"></dp></block> |
|||
<block v-if="curTopIndex==2"> |
|||
<view class="mulubox flex" v-for="(item, index) in datalist" :key="index" @tap="todetail" :data-mianfei='item.ismianfei' :data-url="'mldetail?id='+item.id+'&kcid='+item.kcid"> |
|||
<view class="left_box"> |
|||
<image v-if="item.kctype==1" :src="event_rul + '/static/img/static/img/tw_icon.png'" /> |
|||
<image v-if="item.kctype==2" :src="event_rul + '/static/img/static/img/mp3_icon.png'" /> |
|||
<image v-if="item.kctype==3" :src="event_rul + '/static/img/static/img/video_icon.png'" /> |
|||
</view> |
|||
<view class="right_box flex"> |
|||
<view class="title_box"> |
|||
<view class="t1"> {{item.name}}</view> |
|||
<view> <text v-if="item.kctype==1" class="t2">图文课程 </text> |
|||
<text v-if="item.kctype==2" class="t2">音频课程 </text> |
|||
<text v-if="item.kctype==3" class="t2">视频课程 </text> |
|||
<text v-if="item.kctype!=1" class="t2"> 时长: {{item.duration}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="skbtn" v-if="item.ismianfei && product.price>0">试看</view> |
|||
<view class="skbtn" v-if="product.price==0">免费</view> |
|||
</view> |
|||
</view> |
|||
<nomore text="没有更多课程了" v-if="nomore"></nomore> |
|||
<nodata text="没有查找到相关课程" v-if="nodata"></nodata> |
|||
</block> |
|||
</view> |
|||
<view style="width:100%;height:140rpx;"></view> |
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':''" v-if="product.status==1"> |
|||
<view class="f1"> |
|||
<view class="item" @tap="goto" :data-url="'list?bid='+product.bid"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/shou.png'"/> |
|||
<view class="t1">首页</view> |
|||
</view> |
|||
<view class="item" @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="item" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
|
|||
<view class="item" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
|
|||
<view v-if="product.price==0 || product.ispay==1" class="tobuy flex-x-center flex-y-center" @tap="goto" :data-url="'mldetail?kcid='+product.id" :style="{background:t('color1')}" >立即学习</view> |
|||
<view v-else class="tobuy flex-x-center flex-y-center" @tap="tobuy" :style="{background:t('color1')}" >立即购买</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<scrolltop :isshow="scrolltopshow"></scrolltop> |
|||
|
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image :src="event_rul + '/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul + '/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
isload:false, |
|||
isfavorite: false, |
|||
current: 0, |
|||
product: [], |
|||
pagecontent: "", |
|||
title: "", |
|||
sharepic: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
scrolltopshow: false, |
|||
kfurl:'', |
|||
timeDialogShow: false, |
|||
curTopIndex: 1, |
|||
datalist: [], |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
console.log(sharewxdata) |
|||
console.log(query) |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdatalist(true); |
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var id = this.opt.id || 0; |
|||
that.loading = true; |
|||
app.get('ApiKecheng/detail', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.textset = app.globalData.textset; |
|||
var product = res.product; |
|||
var pagecontent = JSON.parse(product.detail); |
|||
that.product = product; |
|||
that.pagecontent = pagecontent; |
|||
that.title = product.name; |
|||
that.isfavorite = res.isfavorite; |
|||
that.sharepic = product.pics[0]; |
|||
uni.setNavigationBarTitle({ |
|||
title: product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.loaded({title:product.name,pic:product.pic}); |
|||
}); |
|||
}, |
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current |
|||
}, |
|||
buydialogChange: function (e) { |
|||
if(!this.buydialogShow){ |
|||
this.btntype = e.currentTarget.dataset.btntype; |
|||
} |
|||
this.buydialogShow = !this.buydialogShow; |
|||
}, |
|||
currgg: function (e) { |
|||
console.log(e); |
|||
var that = this |
|||
this.ggname = e.ggname; |
|||
that.ggid = e.ggid |
|||
that.proid = e.proid |
|||
that.num = e.num |
|||
}, |
|||
switchTopTab: function (e) { |
|||
var that = this; |
|||
this.curTopIndex = e.currentTarget.dataset.index; |
|||
this.getdatalist(); |
|||
}, |
|||
getdatalist: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var id = that.opt.id ? that.opt.id : ''; |
|||
var order = that.order; |
|||
var field = that.field; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiKecheng/getmululist', {pagenum: pagenum,field: field,order: order,id:id}, function (res) { |
|||
that.loading = false; |
|||
uni.stopPullDownRefresh(); |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
todetail:function(e){ |
|||
var that = this; |
|||
var url = e.currentTarget.dataset.url; |
|||
var ismf = e.currentTarget.dataset.mianfei; |
|||
if(ismf==1 || that.product.ispay==1 || that.product.price==0){ |
|||
app.goto(url); |
|||
}else{ |
|||
app.error('请先购买课程'); |
|||
} |
|||
}, |
|||
//收藏操作 |
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.post('ApiKecheng/addfavorite', {proid: proid,type: 'kecheng'}, function (data) { |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite; |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('生成海报中'); |
|||
app.post('ApiKecheng/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
showfuwudetail: function () { |
|||
this.showfuwudialog = true; |
|||
}, |
|||
hidefuwudetail: function () { |
|||
this.showfuwudialog = false |
|||
}, |
|||
showcuxiaodetail: function () { |
|||
this.showcuxiaodialog = true; |
|||
}, |
|||
hidecuxiaodetail: function () { |
|||
this.showcuxiaodialog = false |
|||
}, |
|||
getcoupon:function(){ |
|||
this.showcuxiaodialog = false; |
|||
this.getdata(); |
|||
}, |
|||
onPageScroll: function (e) { |
|||
var that = this; |
|||
var scrollY = e.scrollTop; |
|||
if (scrollY > 200) { |
|||
that.scrolltopshow = true; |
|||
} |
|||
if(scrollY < 150) { |
|||
that.scrolltopshow = false |
|||
} |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
that.sharetypevisible = false; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/kecheng/detail?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/kecheng/detail'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
showsubqrcode:function(){ |
|||
this.$refs.qrcodeDialog.open(); |
|||
}, |
|||
closesubqrcode:function(){ |
|||
this.$refs.qrcodeDialog.close(); |
|||
}, |
|||
tobuy: function (e) { |
|||
var that=this |
|||
//购买 |
|||
app.post('ApiKecheng/createOrder', { |
|||
kcid:that.product.id, |
|||
}, function(res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + res.payorderid); |
|||
}); |
|||
}, |
|||
|
|||
} |
|||
|
|||
}; |
|||
</script> |
|||
<style> |
|||
.follow_topbar {height:88rpx; width:100%;max-width:640px; background:rgba(0,0,0,0.8); position:fixed; top:0; z-index:13;} |
|||
.follow_topbar .headimg {height:64rpx; width:64rpx; margin:6px; float:left;} |
|||
.follow_topbar .headimg image {height:64rpx; width:64rpx;} |
|||
.follow_topbar .info {height:56rpx; padding:16rpx 0;} |
|||
.follow_topbar .info .i {height:28rpx; line-height:28rpx; color:#ccc; font-size:24rpx;} |
|||
.follow_topbar .info {height:80rpx; float:left;} |
|||
.follow_topbar .sub {height:48rpx; width:auto; background:#FC4343; padding:0 20rpx; margin:20rpx 16rpx 20rpx 0; float:right; font-size:24rpx; color:#fff; line-height:52rpx; border-radius:6rpx;} |
|||
.qrcodebox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.qrcodebox .img{width:400rpx;height:400rpx} |
|||
.qrcodebox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.qrcodebox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
|
|||
.goback{ position: absolute; top:0 ;width:64rpx ; height: 64rpx;z-index: 10000; margin: 30rpx;} |
|||
.goback img{ width:64rpx ; height: 64rpx;} |
|||
|
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 420rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
|
|||
.provideo{background:rgba(255,255,255,0.7);width:160rpx;height:54rpx;padding:0 20rpx 0 4rpx;border-radius:27rpx;position:absolute;bottom:30rpx;left:50%;margin-left:-80rpx;display:flex;align-items:center;justify-content:space-between} |
|||
.provideo image{width:50rpx;height:50rpx;} |
|||
.provideo .txt{flex:1;text-align:center;padding-left:10rpx;font-size:24rpx;color:#333} |
|||
|
|||
.videobox{width:100%;height:750rpx;text-align:center;background:#000} |
|||
.videobox .video{width:100%;height:650rpx;} |
|||
.videobox .parsevideo{margin:0 auto;margin-top:20rpx;height:40rpx;line-height:40rpx;color:#333;background:#ccc;width:140rpx;border-radius:25rpx;font-size:24rpx;} |
|||
|
|||
.header {padding: 20rpx 3%;background: #fff; width: 100%; border-radius:10rpx; margin: auto; margin-bottom: 20rpx; position: relative;} |
|||
.header .price_share{width:100%;height:100rpx;display:flex;align-items:center;justify-content:space-between} |
|||
.header .price_share .price{display:flex;align-items:flex-end} |
|||
.header .price_share .price .f1{font-size:50rpx;color:#51B539;font-weight:bold} |
|||
.header .price_share .price .f2{font-size:26rpx;color:#C2C2C2;text-decoration:line-through;margin-left:30rpx;padding-bottom:5px} |
|||
.header .price_share .share{display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.header .price_share .share .img{width:32rpx;height:32rpx;margin-bottom:2px} |
|||
.header .price_share .share .txt{color:#333333;font-size:20rpx} |
|||
.header .title {color:#000000;font-size:32rpx;line-height:42rpx;font-weight:bold;} |
|||
.header .sellpoint{font-size:28rpx;color: #666;padding-top:20rpx;} |
|||
.header .sales_stock{height:60rpx;line-height:60rpx;font-size:24rpx;color:#BBB; } |
|||
.header .commission{display:inline-block;margin-top:20rpx;margin-bottom:10rpx;border-radius:10rpx;font-size:20rpx;height:44rpx;line-height:44rpx;padding:0 20rpx} |
|||
|
|||
|
|||
.popup__container{position: fixed;bottom: 0;left: 0;right: 0;width:100%;height:auto;z-index:10;background:#fff} |
|||
.popup__overlay{position: fixed;bottom: 0;left: 0;right: 0;width:100%;height: 100%;z-index: 11;opacity:0.3;background:#000} |
|||
.popup__modal{width: 100%;position: absolute;bottom: 0;color: #3d4145;overflow-x: hidden;overflow-y: hidden;opacity:1;padding-bottom:20rpx;background: #fff;border-radius:20rpx 20rpx 0 0;z-index:12;min-height:600rpx;max-height:1000rpx;} |
|||
.popup__title{text-align: center;padding:30rpx;position: relative;position:relative} |
|||
.popup__title-text{font-size:32rpx} |
|||
.popup__close{position:absolute;top:34rpx;right:34rpx} |
|||
.popup__content{width:100%;max-height:880rpx;overflow-y:scroll;padding:20rpx 0;} |
|||
.service-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.service-item .prefix{padding-top: 2px;} |
|||
.service-item .suffix{padding-left: 10rpx;} |
|||
.service-item .suffix .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;} |
|||
|
|||
|
|||
.shop{display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 100rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:6rpx;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx;} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx; width: 100%; margin: auto; border-radius: 10rpx; background: #fff;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:40rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.bottombar{ width: 100%; position: fixed;bottom: 0px; left: 0px; background: #fff;display:flex;height:100rpx;padding:0 30rpx 0 10rpx;align-items:center;} |
|||
.bottombar .f1{flex:1;display:flex;align-items:center;margin-right:30rpx;} |
|||
.bottombar .f1 .item{display:flex;flex-direction:column;align-items:center;width:50%;position:relative} |
|||
.bottombar .f1 .item .img{ width:44rpx;height:44rpx} |
|||
.bottombar .f1 .item .t1{font-size:18rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .op{width:60%;border-radius:12rpx;overflow:hidden;display:flex;} |
|||
.bottombar .tocart{flex:1;height:72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;font-size:28rpx;font-weight:bold} |
|||
.bottombar .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;font-size:28rpx;font-weight:bold; background: #FD4A46; } |
|||
.bottombar .cartnum{position:absolute;right:4rpx;top:-4rpx;color:#fff;border-radius:50%;width:32rpx;height:32rpx;line-height:32rpx;text-align:center;font-size:22rpx;} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
|
|||
.pricebox{ width: 100%;border:1px solid #fff; justify-content: space-between;} |
|||
|
|||
.order-tab2{display:flex;width:auto;min-width:100%; padding-top: 10rpx; border-bottom: 1px solid #F7F7F7;} |
|||
.order-tab2 .item{width:20%;padding:0 20rpx;font-size:28rpx;font-weight:bold;text-align: center; color:#999999; height:80rpx; line-height:80rpx; overflow: hidden;position:relative;flex-shrink:0;flex-grow: 1;} |
|||
.order-tab2 .on{color:#222222;} |
|||
.order-tab2 .after{display:none;position:absolute;left:47%;margin-left:-20rpx;bottom:0rpx;height:6rpx;border-radius:1.5px;width:60rpx} |
|||
.order-tab2 .on .after{display:block} |
|||
|
|||
.mulubox{ padding-top: 35rpx; padding-left: 30rpx;} |
|||
.left_box{ display: flex;} |
|||
.left_box image{ width: 44rpx; height:44rpx; margin-right: 40rpx; margin-top: 26rpx; } |
|||
.right_box{ border-bottom: 1px solid #F6F6F6; padding-bottom: 30rpx; width: 100%; justify-content: space-between;} |
|||
.title_box .t1{ color: #1E252F; font-size: 28rpx; font-weight: bold;} |
|||
.title_box .t2{ color: #B8B8B8;font-size: 24rpx;line-height: 60rpx; margin-right: 15rpx;} |
|||
.skbtn{ background-color: #FFEEEC; text-align: center; margin-right: 10px; height: 44rpx; width: 95rpx; color: #FC6D65; font-size: 24rpx; line-height: 40rpx; border-radius: 22rpx; margin-top: 20rpx;} |
|||
</style> |
|||
@ -0,0 +1,107 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap.stop="goto" :data-url="'complete?rid=' + item.id"> |
|||
<view class="content flex" > |
|||
<view class="detail"> |
|||
<text class="t1">{{item.title}}</text> |
|||
<text class="t2">{{item.date}}</text> |
|||
</view> |
|||
<view class="score"> |
|||
<text class="t3">{{item.score}}</text> |
|||
<text class="t4">分</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
codtxt: "", |
|||
nodata:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var kcid = this.opt.kcid || 0; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiKecheng/recordlog', {kcid: kcid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
|
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box .content{display:flex;padding:16rpx 0px; background: #fff; margin:30rpx; border-radius:8rpx; padding: 30rpx; justify-content: space-between;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;width: 70%;} |
|||
.order-box .content .detail .t1{font-size:28rpx;line-height:36rpx;margin-bottom:10rpx;color:#333;font-weight: bold;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #93949E;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .score .t3{height:40rpx;line-height:40rpx; font-size: 32rpx;color:#FF5347; font-weight: bold; margin-top: 30rpx; } |
|||
.order-box .content .score .t4{ font-size: 24rpx;color:#FF5347; } |
|||
.order-box .content .score{ margin-top: 30rpx;} |
|||
|
|||
</style> |
|||
@ -0,0 +1,344 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="search-container" :style="history_show?'height:100%;':''"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<text class="iconfont icon-search"></text> |
|||
<input :value="keyword" placeholder="商品搜索..." placeholder-style="font-size:24rpx;color:#FFFFFF" @confirm="searchConfirm" @input="searchChange" /> |
|||
</view> |
|||
<view class="search-btn" @tap="searchbtn"> |
|||
<text class="iconfont icon-pailie" v-if="!history_show && productlisttype=='itemlist'"></text> |
|||
<text class="iconfont icon-shipailie" v-if="!history_show && productlisttype=='item2'"></text> |
|||
<text v-if="history_show">搜索</text> |
|||
</view> |
|||
</view> |
|||
<view class="search-history" v-show="history_show"> |
|||
<view> |
|||
<text class="search-history-title">最近搜索</text> |
|||
<view class="delete-search-history" @tap="deleteSearchHistory"> |
|||
<image :src="event_rul +'/static/img/static/img/del.png'" style="width:36rpx;height:36rpx"/> |
|||
</view> |
|||
</view> |
|||
<view class="search-history-list"> |
|||
<view v-for="(item, index) in history_list" :key="index" class="search-history-item" :data-value="item" @tap="historyClick">{{item}} |
|||
</view> |
|||
<view v-if="!history_list || history_list.length==0" class="flex-y-center"><image :src="event_rul +'/static/img/static/img/tanhao.png'" style="width:36rpx;height:36rpx;margin-right:10rpx"/>暂无记录 </view> |
|||
</view> |
|||
</view> |
|||
<view class="search-navbar" v-show="!history_show"> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" :style="!field?'color:'+t('color1'):''" data-field="sort" data-order="desc">综合</view> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" :style="field=='sales'?'color:'+t('color1'):''" data-field="sales" data-order="desc">销量</view> |
|||
<view @tap.stop="sortClick" class="search-navbar-item" data-field="sell_price" :data-order="order=='asc'?'desc':'asc'"> |
|||
<text :style="field=='sell_price'?'color:'+t('color1'):''">价格</text> |
|||
<text class="iconfont icon-danbianjiantou1" :style="field=='sell_price'&&order=='asc'?'color:'+t('color1'):''"></text> |
|||
<text class="iconfont icon-danbianjiantou" :style="field=='sell_price'&&order=='desc'?'color:'+t('color1'):''"></text> |
|||
</view> |
|||
<view class="search-navbar-item flex-x-center flex-y-center" @click.stop="showDrawer('showRight')">筛选 <text :class="'iconfont iconshaixuan ' + (showfilter?'active':'')"></text></view> |
|||
</view> |
|||
<uni-drawer ref="showRight" mode="right" @change="change($event,'showRight')" :width="280"> |
|||
<view class="filter-scroll-view"> |
|||
<scroll-view class="filter-scroll-view-box" scroll-y="true"> |
|||
<view class="search-filter"> |
|||
<view class="filter-title">筛选</view> |
|||
<view class="filter-content-title">商品分组</view> |
|||
<view class="search-filter-content"> |
|||
<view class="filter-item" :style="catchegid==''?'color:'+t('color1')+';':''" @tap.stop="groupClick" data-gid="">全部</view> |
|||
<block v-for="(item, index) in glist" :key="index"> |
|||
<view class="filter-item" :style="catchegid==item.id?'color:'+t('color1')+';':''" @tap.stop="groupClick" :data-gid="item.id">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
<view class="filter-content-title">商品分类</view> |
|||
<view class="search-filter-content"> |
|||
<view class="filter-item" :style="catchecid==oldcid?'color:'+t('color1')+'':''" @tap.stop="cateClick" :data-cid="oldcid">全部</view> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<view class="filter-item" :style="catchecid==item.id?'color:'+t('color1')+'':''" @tap.stop="cateClick" :data-cid="item.id">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
<view class="search-filter-btn"> |
|||
<view class="btn" @tap="filterReset">重置</view> |
|||
<view class="btn2" :style="{background:t('color1')}" @tap="filterConfirm">确定</view> |
|||
</view> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
</uni-drawer> |
|||
|
|||
|
|||
</view> |
|||
<view class="product-container"> |
|||
<block v-if="datalist && datalist.length>0"> |
|||
<dp-product-item v-if="productlisttype=='item2'" :data="datalist"></dp-product-item> |
|||
<dp-product-itemlist v-if="productlisttype=='itemlist'" :data="datalist"></dp-product-itemlist> |
|||
</block> |
|||
<nomore text="没有更多商品了" v-if="nomore"></nomore> |
|||
<nodata text="没有查找到相关商品" v-if="nodata"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: true, |
|||
menuindex:-1, |
|||
|
|||
nomore:false, |
|||
nodata:false, |
|||
keyword: '', |
|||
pagenum: 1, |
|||
datalist: [], |
|||
history_list: [], |
|||
history_show: true, |
|||
order: '', |
|||
field:'', |
|||
oldcid: "", |
|||
catchecid: "", |
|||
catchegid: "", |
|||
cid: "", |
|||
gid: '', |
|||
clist: [], |
|||
glist: [], |
|||
productlisttype: 'item2', |
|||
showfilter: "", |
|||
cpid:0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.oldcid = this.opt.cid || ''; |
|||
this.catchecid = this.opt.cid; |
|||
this.cid = this.opt.cid; |
|||
this.gid = this.opt.gid; |
|||
this.cpid = this.opt.cpid || 0; |
|||
this.keyword = this.opt.keyword || ''; |
|||
if(this.cpid > 0){ |
|||
uni.setNavigationBarTitle({ |
|||
title: '可用商品列表' |
|||
}); |
|||
} |
|||
var productlisttype = app.getCache('productlisttype'); |
|||
if (productlisttype) this.productlisttype = productlisttype; |
|||
this.history_list = app.getCache('search_history_list'); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getprolist(); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
var cid = that.opt.cid; |
|||
var gid = that.opt.gid; |
|||
that.loading = true; |
|||
app.get('ApiShop/prolist', {cid: cid,gid: gid}, function (res) { |
|||
that.loading = false; |
|||
that.clist = res.clist; |
|||
that.glist = res.glist; |
|||
that.loaded(); |
|||
console.log(that.keyword) |
|||
if(that.keyword){ |
|||
//that.getprolist(); |
|||
} |
|||
}); |
|||
}, |
|||
getprolist: function () { |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
var order = that.order; |
|||
var field = that.field; |
|||
var gid = that.gid; |
|||
var cid = that.cid; |
|||
var cpid = that.cpid; |
|||
that.history_show = false; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiShop/getprolist',{pagenum: pagenum,keyword: keyword,field: field,order: order,gid: gid,cid: cid,cpid:cpid}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
// 打开窗口 |
|||
showDrawer(e) { |
|||
console.log(e) |
|||
this.$refs[e].open() |
|||
}, |
|||
// 关闭窗口 |
|||
closeDrawer(e) { |
|||
this.$refs[e].close() |
|||
}, |
|||
// 抽屉状态发生变化触发 |
|||
change(e, type) { |
|||
console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭')); |
|||
this[type] = e |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
if (e.detail.value == '') { |
|||
this.history_show = true; |
|||
this.datalist = []; |
|||
} |
|||
}, |
|||
searchbtn: function () { |
|||
var that = this; |
|||
if (that.history_show) { |
|||
var keyword = that.keyword; |
|||
that.searchproduct(); |
|||
} else { |
|||
if (that.productlisttype == 'itemlist') { |
|||
that.productlisttype = 'item2'; |
|||
app.setCache('productlisttype', 'item2'); |
|||
} else { |
|||
that.productlisttype = 'itemlist'; |
|||
app.setCache('productlisttype', 'itemlist'); |
|||
} |
|||
} |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.searchproduct(); |
|||
}, |
|||
searchproduct: function () { |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
that.addHistory(); |
|||
that.getprolist(); |
|||
}, |
|||
sortClick: function (e) { |
|||
var that = this; |
|||
var t = e.currentTarget.dataset; |
|||
that.field = t.field; |
|||
that.order = t.order; |
|||
that.searchproduct(); |
|||
}, |
|||
groupClick: function (e) { |
|||
var that = this; |
|||
var gid = e.currentTarget.dataset.gid; |
|||
if(gid === true) gid = ''; |
|||
that.catchegid = gid |
|||
}, |
|||
cateClick: function (e) { |
|||
var that = this; |
|||
var cid = e.currentTarget.dataset.cid; |
|||
if(cid === true) cid = ''; |
|||
that.catchecid = cid |
|||
}, |
|||
filterConfirm(){ |
|||
this.cid = this.catchecid; |
|||
this.gid = this.catchegid; |
|||
this.searchproduct(); |
|||
this.$refs['showRight'].close() |
|||
}, |
|||
filterReset(){ |
|||
this.catchecid = this.oldcid; |
|||
this.catchegid = ''; |
|||
}, |
|||
filterClick: function () { |
|||
this.showfilter = !this.showfilter |
|||
}, |
|||
addHistory: function () { |
|||
var that = this; |
|||
var keyword = that.keyword; |
|||
if (app.isNull(keyword)) return; |
|||
var historylist = app.getCache('search_history_list'); |
|||
if (app.isNull(historylist)) historylist = []; |
|||
historylist.unshift(keyword); |
|||
var newhistorylist = []; |
|||
for (var i in historylist) { |
|||
if (historylist[i] != keyword || i == 0) { |
|||
newhistorylist.push(historylist[i]); |
|||
} |
|||
} |
|||
if (newhistorylist.length > 5) newhistorylist.splice(5, 1); |
|||
app.setCache('search_history_list', newhistorylist); |
|||
that.history_list = newhistorylist |
|||
}, |
|||
historyClick: function (e){ |
|||
var that = this; |
|||
var keyword = e.currentTarget.dataset.value; |
|||
if (keyword.length == 0) return; |
|||
that.keyword = keyword; |
|||
that.searchproduct(); |
|||
}, |
|||
deleteSearchHistory: function () { |
|||
var that = this; |
|||
that.history_list = null; |
|||
app.removeCache("search_history_list"); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang="scss"> |
|||
.container {background: #F5F5F5;height: 100vh;} |
|||
.search-container {position: fixed;width: 100%;z-index:9;top:var(--window-top);background: #0A5D3B;} |
|||
.topsearch{width:100%;padding:16rpx 20rpx;} |
|||
.topsearch .f1{height: 80rpx;border-radius: 40rpx;border: 0;background: rgba(255,255,255,.3);flex:1;padding: 0 28rpx;} |
|||
.topsearch .f1 .icon-search{font-size: 40rpx;margin-right: 16rpx;color:#FFFFFF;} |
|||
.topsearch .f1 input{height: 100%;flex: 1;font-size: 28rpx;color:#FFFFFF;} |
|||
.topsearch .search-btn{ |
|||
display:flex;align-items:center;color:#FFFFFF;text-align:center;margin-left:20rpx; |
|||
.iconfont {font-size:40rpx;} |
|||
} |
|||
.search-navbar {border-radius: 12rpx 12rpx 0 0;overflow: hidden;background: #F5F5F5;display: flex;text-align: center;align-items:center;padding:32rpx 0} |
|||
.search-navbar-item {flex: 1;height: 28rpx;line-height: 28rpx;position: relative;font-size:28rpx;font-weight:bold;color:#333333} |
|||
|
|||
.search-navbar-item .icon-danbianjiantou,.icon-danbianjiantou1{font-size: 28rpx;color:#7D7D7D} |
|||
.search-navbar-item .icon-danbianjiantou {margin-left: 10rpx;} |
|||
.search-navbar-item .iconshaixuan{margin-left:10rpx;font-size:22rpx;color:#7d7d7d} |
|||
.search-history {padding: 24rpx 34rpx;} |
|||
.search-history .search-history-title {color: #666;} |
|||
.search-history .delete-search-history {float: right;padding: 15rpx 20rpx;margin-top: -15rpx;} |
|||
.search-history-list {padding: 24rpx 0 0 0;} |
|||
.search-history-list .search-history-item {display: inline-block;height: 50rpx;line-height: 50rpx;padding: 0 20rpx;margin: 0 10rpx 10rpx 0;background: #ddd;border-radius: 10rpx;font-size: 26rpx;} |
|||
|
|||
.filter-scroll-view{margin-top:var(--window-top)} |
|||
.search-filter{display: flex;flex-direction: column;text-align: left;width:100%;flex-wrap:wrap;padding:0;} |
|||
.filter-content-title{color:#999;font-size:28rpx;height:30rpx;line-height:30rpx;padding:0 30rpx;margin-top:30rpx;margin-bottom:10rpx} |
|||
.filter-title{color:#BBBBBB;font-size:32rpx;background:#F8F8F8;padding:60rpx 0 30rpx 20rpx;} |
|||
.search-filter-content{display: flex;flex-wrap:wrap;padding:10rpx 20rpx;} |
|||
.search-filter-content .filter-item{min-width: 140rpx;box-sizing: border-box;background:#F4F4F4;border-radius:28rpx;color:#2B2B2B;font-weight:bold;margin:10rpx 10rpx;min-width:140rpx;height:56rpx;line-height:56rpx;text-align:center;font-size: 24rpx;padding:0 20rpx} |
|||
.search-filter-content .close{text-align: right;font-size:24rpx;color:#ff4544;width:100%;padding-right:20rpx} |
|||
.search-filter button .icon{margin-top:6rpx;height:54rpx;} |
|||
.search-filter-btn{display:flex;padding:30rpx 30rpx;justify-content: space-between} |
|||
.search-filter-btn .btn{width:240rpx;height:66rpx;line-height:66rpx;background:#fff;border:1px solid #e5e5e5;border-radius:33rpx;color:#2B2B2B;font-weight:bold;font-size:24rpx;text-align:center} |
|||
.search-filter-btn .btn2{width:240rpx;height:66rpx;line-height:66rpx;border-radius:33rpx;color:#fff;font-weight:bold;font-size:24rpx;text-align:center} |
|||
|
|||
.product-container {width: 100%;font-size:26rpx;padding:206rpx 24rpx 0;} |
|||
</style> |
|||
@ -0,0 +1,288 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
|
|||
<view class="wrap"> |
|||
<view class="top flex"> |
|||
<view class="f1" v-if="tkdata.type==1 && tkdata.rightcount==1">单选题</view> |
|||
<view class="f1" v-if="tkdata.type==1 && tkdata.rightcount==2">多选题</view> |
|||
<view class="f1" v-if="tkdata.type==2">填空题</view> |
|||
<view class="f2">倒计时:{{djs}}</view> |
|||
<view class="f3">{{hasnum}}/{{nums}}</view> |
|||
</view> |
|||
<view class="question" > |
|||
<view class="title" > |
|||
{{hasnum}}.{{tkdata.title}} |
|||
</view> |
|||
<block v-if="tkdata.type==1 && tkdata.rightcount==1"> |
|||
<view class="option_group" > |
|||
<view :class="'option flex ' +(index==currentindex?'on':'') " v-for="(item, index) in tkdata.option" @tap="selectOption" :data-index='index'> |
|||
{{tkdata.sorts[index]}} |
|||
<view class="after" ></view> |
|||
<view class="t1">{{item}}</view></view> |
|||
</view> |
|||
</block> |
|||
<block v-if="tkdata.type==1 && tkdata.rightcount>1"> |
|||
<view class="option_group" > |
|||
<view :class="'option flex '+(isActive.indexOf(index)!=-1?'on':'')" v-for="(item, index) in tkdata.option" @tap="selectOption" :data-index='index'> |
|||
{{tkdata.sorts[index]}} |
|||
<view class="after" ></view> |
|||
<view class="t1">{{item}}</view></view> |
|||
</view> |
|||
</block> |
|||
<block v-if="tkdata.type==2"> |
|||
<view class="option_group"> |
|||
<view class="uni-textarea"> |
|||
<textarea placeholder-style="color:#222" placeholder="答:" @blur="bindTextAreaBlur" :value="right_option" /> |
|||
</view> |
|||
|
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="bottom flex"> |
|||
<block v-if="hasnum==1"><button class="upbut flex-x-center flex-y-center hui" >上一题</button></block> |
|||
<block v-if="hasnum>1"><button @tap="prevquestion" data-dttype="up" class="upbut flex-x-center flex-y-center" :style="{background:t('color1')}" >上一题</button></block> |
|||
<button v-if="nums==hasnum" @tap="finish" data-dttype="down" class="downbtn flex-x-center flex-y-center" :style="{background:t('color1')}" >交卷</button> |
|||
<button v-else @tap="nextquestion" data-dttype="down" class="downbtn flex-x-center flex-y-center" :style="{background:t('color1')}" >下一题</button> |
|||
</view> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
title: "", |
|||
datalist: [], |
|||
currentindex:'-1', |
|||
up:'', |
|||
djs: '', |
|||
tkdata:[], |
|||
set:{}, |
|||
hasnum:0, |
|||
rid:0, |
|||
nums:0, |
|||
dtid:0, |
|||
lefttime:0, |
|||
right_option:'', |
|||
isActive: [] |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var id = this.opt.id || 0; |
|||
that.loading = true; |
|||
app.post('ApiKecheng/getTiku', {kcid: id,tmid:that.tmid,op:that.op,rid:that.rid}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
if (res.status == 2) { |
|||
app.alert(res.msg); |
|||
app.goto('complete?rid=' + that.rid);return; |
|||
} |
|||
that.set = res.data.set; |
|||
that.tkdata = res.data.tkdata; |
|||
that.hasnum = res.data.hasnum; |
|||
that.rid = res.data.rid; |
|||
that.nums = res.data.nums; |
|||
that.dtid = res.data.dtid; |
|||
that.lefttime = res.data.lefttime; |
|||
if (res.data.lefttime > 0) { |
|||
interval = setInterval(function () { |
|||
that.lefttime = that.lefttime - 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
}else{ |
|||
app.goto('complete?rid=' + res.rid);return; |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
//上一题 |
|||
prevquestion:function(){ |
|||
var that=this |
|||
that.loading = true; |
|||
app.post('ApiKecheng/prevquestion', { dtid:that.dtid}, function(res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} |
|||
that.tkdata = res.data.tkdata; |
|||
that.hasnum = res.data.hasnum; |
|||
that.dtid = res.data.dtid; |
|||
that.isActive = []; |
|||
if(that.tkdata.type==1 && res.data.answer!=null){ |
|||
if(that.tkdata.rightcount>1){ |
|||
var answer = res.data.answer; |
|||
answer.map((item) => { |
|||
that.isActive.push(item); |
|||
}) |
|||
} |
|||
that.currentindex = res.data.answer; |
|||
}else{ |
|||
that.right_option = res.data.answer; |
|||
} |
|||
}); |
|||
}, |
|||
//下一题 |
|||
nextquestion:function(){ |
|||
var that=this |
|||
var right_option=''; |
|||
if(that.tkdata.type==1){ |
|||
right_option = that.currentindex; |
|||
if(right_option==-1){ |
|||
app.error('请选择答案');return; |
|||
} |
|||
} |
|||
if(that.tkdata.type==2){ |
|||
right_option = that.right_option; |
|||
if(right_option=='' || right_option==undefined){ |
|||
app.error('请填写答案');return; |
|||
} |
|||
} |
|||
that.loading = true; |
|||
app.post('ApiKecheng/nextquestion', {dtid:that.dtid, right_option:right_option}, function(res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} |
|||
that.tkdata = res.data.tkdata; |
|||
that.hasnum = res.data.hasnum; |
|||
that.dtid = res.data.dtid; |
|||
that.isActive = []; |
|||
if(that.tkdata.type==1 && res.data.answer!=null){ |
|||
if(that.tkdata.rightcount>1){ |
|||
var answer = res.data.answer; |
|||
answer.map((item) => { |
|||
that.isActive.push(item); |
|||
}) |
|||
console.log(that.isActive) |
|||
} |
|||
that.currentindex = res.data.answer; |
|||
}else{ |
|||
that.right_option = res.data.answer; |
|||
} |
|||
if(!res.data.answer){ |
|||
that.currentindex='-1'; |
|||
that.isActive=[]; |
|||
} |
|||
|
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var totalsec = that.lefttime; |
|||
if (totalsec <= 0) { |
|||
that.djs = '00时00分00秒'; |
|||
that.finish(); |
|||
//that.toanswer();return; |
|||
//app.goto('complete?rid=' + that.rid);return; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
that.djs = djs; |
|||
} |
|||
}, |
|||
bindTextAreaBlur: function (e) { |
|||
var that=this |
|||
that.right_option = e.detail.value |
|||
}, |
|||
selectOption: function (e) { |
|||
var index = e.currentTarget.dataset.index |
|||
var that = this; |
|||
if(that.tkdata.rightcount==1){ |
|||
that.currentindex = index; |
|||
}else{ |
|||
if (that.isActive.indexOf(index) == -1) { |
|||
that.isActive.push(index); //选中添加到数组里 |
|||
} else { |
|||
that.isActive.splice(that.isActive.indexOf(index), 1); //取消 |
|||
} |
|||
that.currentindex = that.isActive; |
|||
} |
|||
}, |
|||
bindanswer:function(e){ |
|||
var that=this; |
|||
var op = e.currentTarget.dataset.dttype |
|||
that.op = op; |
|||
that.toanswer(); |
|||
}, |
|||
finish:function(){ |
|||
var that=this |
|||
var right_option=''; |
|||
if(that.tkdata.type==1 && that.lefttime>0){ |
|||
right_option = that.currentindex; |
|||
if(right_option==-1){ |
|||
app.error('请选择答案');return; |
|||
} |
|||
} |
|||
if(that.tkdata.type==2 && that.lefttime>0){ |
|||
right_option = that.right_option; |
|||
if(right_option=='' || right_option==undefined){ |
|||
app.error('请填写答案');return; |
|||
} |
|||
} |
|||
app.post('ApiKecheng/tofinish', { |
|||
dtid:that.dtid, |
|||
right_option:right_option |
|||
}, function(res) { |
|||
app.showLoading(false); |
|||
if(res.status == 1){ |
|||
clearInterval(interval); |
|||
app.goto('complete?rid=' + that.rid);return; |
|||
} |
|||
}); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
} |
|||
|
|||
}; |
|||
</script> |
|||
<style> |
|||
.wrap{ background: #fff; margin: 30rpx; border-radius: 10rpx; padding: 30rpx;} |
|||
|
|||
.top{height: 120rpx; line-height: 100rpx; justify-content: space-between;} |
|||
.top .f1{ color:#93949E;font-size: 28rpx;} |
|||
.top .f2{ color:#FF5347 ; font-size: 28rpx;} |
|||
.top .f3{ color:#93949E ; font-size: 28rpx;} |
|||
.question .title{ font-size: 30rpx; color: #333; font-weight: bold;} |
|||
|
|||
.option_group .option{ position: relative; padding-left: 37rpx; height: 96rpx; line-height: 96rpx; background:#F8F4F4 ; margin-top: 30rpx; border-radius: 48rpx; } |
|||
.option_group .option .t1{ margin-left: 40rpx;} |
|||
.option_group .option.on{ background: #FDF1F1; color:#FF5347 ; border: 1px solid #FFAEA8 ; } |
|||
.option_group .option.on .after{ border:1px solid #FF8D8D; } |
|||
.option_group .option .after{ border:1px solid #BBB; height:29rpx; position: absolute;left: 12%; margin-top: 35rpx;} |
|||
.bottom .upbut{width:240rpx;height: 88rpx; line-height: 88rpx;color: #fff; border-radius: 44rpx;border: none;font-size:28rpx;font-weight:bold; background: #FD4A46; } |
|||
.bottom .upbut.hui{ background:#E3E3E3;} |
|||
.bottom .downbtn{margin-left:50rpx;width:360rpx;height: 88rpx; border-radius: 44rpx; line-height: 72rpx;color: #fff; border: none;font-size:28rpx;font-weight:bold; background: #FD4A46; } |
|||
.bottom{ margin-top: 30rpx; padding: 30rpx;} |
|||
.uni-textarea{ margin-top: 30rpx; background: #FAFAFA; border: 1px solid #EBE5E5;border-radius: 8rpx; padding: 30rpx;} |
|||
</style> |
|||
@ -0,0 +1,735 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul +'/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}} <text v-if="address.company">{{address.company}}</text></view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
<view class="buydata"> |
|||
<view class="btitle"><image class="img" :src="event_rul +'/static/img/static/img/ico-shop.png'"/>{{business.name}}</view> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex"> |
|||
<view class="img"> |
|||
<image class="img" v-if="guige.pic" :src="guige.pic"></image> |
|||
<image class="img" v-else :src="product.pic"></image> |
|||
</view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2">规格:{{guige.name}}</view> |
|||
<view class="f3">¥{{guige.sell_price}}<text v-if="buytype!=1" class="collage_icon">拼团价</text> × {{totalnum}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice > product_price">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">商品金额</text> |
|||
<text class="f2">¥{{product_price}}</text> |
|||
</view> |
|||
<view class="price" v-if="leadermoney*1>0"> |
|||
<text class="f1">团长优惠</text> |
|||
<text class="f2">-¥{{leadermoney}}</text> |
|||
</view> |
|||
<view class="price" v-if="leveldk_money*1>0"> |
|||
<text class="f1">{{t('会员')}}折扣({{userinfo.discount}}折)</text> |
|||
<text class="f2">-¥{{leveldk_money}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freight_price}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<view class="f1">{{t('优惠券')}}</view> |
|||
<view v-if="couponList.length>0" class="f2" @tap="showCouponList"><text style="color:#fff;padding:4rpx 16rpx;font-weight:normal;border-radius:8rpx;font-size:24rpx" :style="{background:t('color1')}">{{couponrid!=0?couponList[couponkey].couponname:couponList.length+'张可用'}}</text><text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
<text class="f2" v-else style="color:#999">无可用{{t('优惠券')}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="scoredk flex" v-if="userinfo.score2money > 0"> |
|||
<checkbox-group @change="scoredk" class="flex" style="width:100%"> |
|||
<view class="f1"> |
|||
<view>{{userinfo.score*1}} {{t('积分')}}可抵扣 <text style="color:#e94745">{{userinfo.scoredk_money*1}}</text> 元</view> |
|||
<view style="font-size:22rpx;color:#999" v-if="userinfo.scoredkmaxpercent > 0 && userinfo.scoredkmaxpercent<100">最多可抵扣订单金额的{{userinfo.scoredkmaxpercent}}%</view> |
|||
</view> |
|||
<view class="f2">使用{{t('积分')}}抵扣 |
|||
<checkbox value="1" style="margin-left:6px;transform:scale(.8)"></checkbox> |
|||
</view> |
|||
</checkbox-group> |
|||
</view> |
|||
<view style="width: 100%;height:110rpx"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="text1 flex1">总计: |
|||
<text style="font-weight:bold;font-size:36rpx">¥{{totalprice}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="couponvisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{t('优惠券')}}</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="handleClickMask"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<couponlist :couponlist="couponList" :choosecoupon="true" :selectedrid="couponrid" :bid="product.bid" @chooseCoupon="chooseCoupon"></couponlist> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
business:{}, |
|||
productList: [], |
|||
freightList: [], |
|||
couponList: [], |
|||
couponrid: 0, |
|||
coupontype: 1, |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
usescore: 0, |
|||
totalprice: '0.00', |
|||
product_price: 0, |
|||
leveldk_money: 0, |
|||
scoredk_money: 0, |
|||
coupon_money: 0, |
|||
storedata: [], |
|||
storeid: '', |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
isload: 0, |
|||
leadermoney: 0, |
|||
couponvisible: false, |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
product: "", |
|||
guige: "", |
|||
userinfo: "", |
|||
buytype: "", |
|||
scorebdkyf: "", |
|||
totalnum: "", |
|||
havetongcheng: "", |
|||
weight: "", |
|||
goodsnum: "", |
|||
beizhu: "", |
|||
couponkey: 0, |
|||
storeshowall:false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/buy', {proid: that.opt.proid,ggid: that.opt.ggid,num: that.opt.num,buytype: that.opt.buytype}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg, function(){ |
|||
app.goback() |
|||
}); |
|||
return; |
|||
} |
|||
var product = res.product; |
|||
var freightList = res.freightList; |
|||
var userinfo = res.userinfo; |
|||
var couponList = res.couponList; |
|||
that.product = product; |
|||
that.guige = res.guige; |
|||
that.business = res.business; |
|||
that.freightList = freightList; |
|||
that.userinfo = userinfo; |
|||
that.couponList = couponList; |
|||
that.buytype = res.buytype; |
|||
that.address = res.address; |
|||
that.scorebdkyf = res.scorebdkyf; |
|||
that.totalnum = res.totalnum; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
var leadermoney = 0; //商品总价 重量 |
|||
|
|||
var product_price = res.product_price; |
|||
|
|||
if (res.buytype == 2 && product.leadermoney * 1 > 0) { |
|||
leadermoney = product.leadermoney * 1; |
|||
} |
|||
leadermoney = leadermoney.toFixed(2); //会员折扣 |
|||
var leveldk_money = 0; |
|||
if (userinfo.discount > 0 && userinfo.discount < 10) { |
|||
leveldk_money = (product_price - leadermoney) * (1 - userinfo.discount * 0.1); |
|||
leveldk_money = leveldk_money.toFixed(2); |
|||
} |
|||
that.product_price = res.product_price; |
|||
that.leadermoney = leadermoney; |
|||
that.leveldk_money = leveldk_money; |
|||
that.scoredk_money = userinfo.scoredk_money; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
|
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
for (var j in freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude) { |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var product_price = parseFloat(that.product_price); //+商品总价 |
|||
var leadermoney = parseFloat(that.leadermoney); //-团长优惠 |
|||
var leveldk_money = parseFloat(that.leveldk_money); //-会员折扣 |
|||
var coupon_money = parseFloat(that.coupon_money); //-优惠券抵扣 |
|||
var address = that.address; //算运费 |
|||
var freightdata = that.freightList[that.freightkey]; |
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress; |
|||
var freight_price = freightdata.freight_price; |
|||
if (that.coupontype == 4) { |
|||
freight_price = 0; |
|||
coupon_money = 0; |
|||
} |
|||
var totalprice = product_price - leadermoney - leveldk_money - coupon_money; |
|||
if (totalprice < 0) totalprice = 0; //优惠券不抵扣运费 |
|||
|
|||
var oldtotalprice = totalprice; |
|||
if (that.usescore) { |
|||
var scoredk_money = parseFloat(that.scoredk_money); //-积分抵扣 |
|||
} else { |
|||
var scoredk_money = 0; |
|||
} |
|||
totalprice = totalprice + freight_price - scoredk_money; |
|||
if (that.scorebdkyf == '1' && scoredk_money > 0 && totalprice < freight_price) { |
|||
//积分不抵扣运费 |
|||
totalprice = freight_price; |
|||
scoredk_money = oldtotalprice - freight_price; |
|||
} |
|||
var scoredkmaxpercent = parseFloat(that.userinfo.scoredkmaxpercent); //最大抵扣比例 |
|||
|
|||
if (scoredk_money > 0 && scoredkmaxpercent > 0 && scoredkmaxpercent < 100 && scoredk_money > oldtotalprice * scoredkmaxpercent * 0.01) { |
|||
scoredk_money = oldtotalprice * scoredkmaxpercent * 0.01; |
|||
totalprice = oldtotalprice - scoredk_money; |
|||
} |
|||
if (totalprice < 0) totalprice = 0; |
|||
freight_price = freight_price.toFixed(2); |
|||
totalprice = totalprice.toFixed(2); |
|||
that.totalprice = totalprice |
|||
that.freight_price = freight_price; |
|||
}, |
|||
//积分抵扣 |
|||
scoredk: function (e) { |
|||
var usescore = e.detail.value[0]; |
|||
if (!usescore) usescore = 0; |
|||
this.usescore = usescore; |
|||
this.calculatePrice(); |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
chooseCoupon: function (e) { |
|||
var couponrid = e.rid; |
|||
var couponkey = e.key; |
|||
|
|||
if (couponrid == this.couponrid) { |
|||
this.couponkey = 0; |
|||
this.couponrid = 0; |
|||
this.coupontype = 1; |
|||
this.coupon_money = 0; |
|||
this.couponvisible = false; |
|||
} else { |
|||
var couponList = this.couponList; |
|||
var coupon_money = couponList[couponkey]['money']; |
|||
var coupontype = couponList[couponkey]['type']; |
|||
if (coupontype == 4) { |
|||
coupon_money = this.freightprice; |
|||
} |
|||
this.couponkey = couponkey; |
|||
this.couponrid = couponrid; |
|||
this.coupontype = coupontype; |
|||
this.coupon_money = coupon_money; |
|||
this.couponvisible = false; |
|||
} |
|||
this.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var buytype = this.buytype; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var prodata = this.opt.prodata; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
var usescore = this.usescore; |
|||
var couponkey = this.couponkey; |
|||
var couponrid = this.couponrid; |
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var freight_time = that.freight_time; |
|||
|
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
|
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
|
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/createOrder', { |
|||
proid: that.opt.proid, |
|||
ggid: that.opt.ggid, |
|||
num: that.opt.num, |
|||
buytype: buytype, |
|||
teamid: that.opt.teamid, |
|||
storeid: storeid, |
|||
couponrid: couponrid, |
|||
freightid: freightid, |
|||
freight_time: freight_time, |
|||
addressid: addressid, |
|||
usescore: usescore, |
|||
linkman: linkman, |
|||
tel: tel, |
|||
formdata: newformdata, |
|||
shareid: that.opt.shareid |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
|
|||
if (data.status == 1) { |
|||
app.goto('/pages/pay/pay?id=' + data.payorderid); |
|||
}else{ |
|||
app.error(data.msg); |
|||
return; |
|||
} |
|||
}); |
|||
}, |
|||
showCouponList: function () { |
|||
this.couponvisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.couponvisible = false; |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
console.log(storeinfo) |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:10rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .text1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .text1 text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
|
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,348 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view @tap.stop="goto" :data-url="'prolist?bid='+bid" class="search-container"> |
|||
<view class="search-box"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/search_ico.png'"></image> |
|||
<view class="search-text">搜索感兴趣的商品</view> |
|||
</view> |
|||
</view> |
|||
<view class="content-container"> |
|||
<view class="nav_left"> |
|||
<view :class="'nav_left_items ' + (curIndex == -1 ? 'active' : '')" @tap="switchRightTab" data-index="-1" data-id="0"><view class="before" :style="{background:t('color1')}"></view>全部</view> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<view :class="'nav_left_items ' + (curIndex == index ? 'active' : '')" @tap="switchRightTab" :data-index="index" :data-id="item.id"><view class="before" :style="{background:t('color1')}"></view>{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
<view class="nav_right"> |
|||
<view class="nav_right-content"> |
|||
<view class="nav-pai"> |
|||
<view class="nav-paili" :style="(!field||field=='sort')?'color:'+t('color1'):''" @tap="changeOrder" data-field="sort" data-order="desc">综合</view> |
|||
<view class="nav-paili" :style="field=='sales'?'color:'+t('color1'):''" @tap="changeOrder" data-field="sales" data-order="desc">销量</view> |
|||
<view class="nav-paili" @tap="changeOrder" data-field="sell_price" :data-order="order=='asc'?'desc':'asc'"> |
|||
<text :style="field=='sell_price'?'color:'+t('color1'):''">价格</text> |
|||
<text class="iconfont iconshangla" :style="field=='sell_price'&&order=='asc'?'color:'+t('color1'):''"></text> |
|||
<text class="iconfont icon-xia" :style="field=='sell_price'&&order=='desc'?'color:'+t('color1'):''"></text> |
|||
</view> |
|||
</view> |
|||
<view class="classify-ul" v-if="curIndex>-1 && clist[curIndex].child.length>0"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<view class="classify-li" :style="curIndex2==-1?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeCTab" :data-id="clist[curIndex].id" data-index="-1">全部</view> |
|||
<block v-for="(item, idx2) in clist[curIndex].child" :key="idx2"> |
|||
<view class="classify-li" :style="curIndex2==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeCTab" :data-id="item.id" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<scroll-view class="classify-box" scroll-y="true" @scrolltolower="scrolltolower"> |
|||
<view class="product-itemlist"> |
|||
<view class="item" v-for="(item,index) in datalist" :key="item.id" @click="goto" :data-url="''+ (item.linktype==1?'product2':'product')+'?id='+item.id"> |
|||
<view class="flex"> |
|||
<view class="product-pic"> |
|||
<image class="image" :src="item.pic" mode="widthFix"/> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="p1"><text class="team_text">{{item.teamnum}}人拼</text><text class="name_1">{{item.name}}</text></view> |
|||
<view class="p2 flex"> |
|||
<view> |
|||
<text class="t1" :style="{color:t('color1')}"><text style="font-size:20rpx;padding-right:1px">¥</text>{{item.sell_price}}</text> |
|||
<text class="t2" v-if="item.market_price*1 > item.sell_price*1">¥{{item.market_price}}</text> |
|||
</view> |
|||
<view class="p3-1" v-if="item.sales>0"><text style="overflow:hidden">已拼{{item.sales}}</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="desc"><text>{{item.teamnum}}人拼团 {{item.gua_num}}人得商品</text> |
|||
|
|||
<view v-if="item.linktype==1"> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==1">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.money}}元参与奖</text> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==2">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.bzj_score}}积分</text> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==3">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.bzj_commission}}元佣金</text> |
|||
</view> |
|||
<view v-else> |
|||
<text v-if="item.teamnum-item.gua_num>0">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.money}}元参与奖</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<nomore text="没有更多商品了" v-if="nomore"></nomore> |
|||
<nodata text="暂无相关商品" v-if="nodata"></nodata> |
|||
<view style="width:100%;height:100rpx"></view> |
|||
</scroll-view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<buydialog v-if="buydialogShow" :proid="proid" @buydialogChange="buydialogChange" :menuindex="menuindex"></buydialog> |
|||
</block> |
|||
<loading v-if="loading" loadstyle="left:62.5%"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
|
|||
pagenum: 1, |
|||
|
|||
nomore: false, |
|||
nodata: false, |
|||
|
|||
order: '', |
|||
|
|||
field: '', |
|||
|
|||
clist: [], |
|||
|
|||
curIndex: -1, |
|||
|
|||
curIndex2: -1, |
|||
|
|||
datalist: [], |
|||
|
|||
nodata: false, |
|||
|
|||
curCid: 0, |
|||
proid:0, |
|||
|
|||
buydialogShow: false, |
|||
bid:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
|
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.bid = this.opt.bid ? this.opt.bid : ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var nowcid = that.opt.cid; |
|||
if (!nowcid) nowcid = ''; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/classify', {cid:nowcid,bid:that.bid}, function (res) { |
|||
that.loading = false; |
|||
var clist = res.data; |
|||
that.clist = clist; |
|||
if (nowcid) { |
|||
for (var i = 0; i < clist.length; i++) { |
|||
if (clist[i]['id'] == nowcid) { |
|||
that.curIndex = i; |
|||
that.curCid = nowcid; |
|||
} |
|||
var downcdata = clist[i]['child']; |
|||
var isget = 0; |
|||
for (var j = 0; j < downcdata; j++) { |
|||
if (downcdata[j]['id'] == nowcid) { |
|||
that.curIndex = i; |
|||
that.curIndex2 = j; |
|||
that.curCid = nowcid; |
|||
isget = 1; |
|||
break; |
|||
} |
|||
} |
|||
if (isget) break; |
|||
} |
|||
} |
|||
that.loaded(); |
|||
that.getdatalist(); |
|||
}); |
|||
}, |
|||
|
|||
getdatalist: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
|
|||
var that = this; |
|||
|
|||
var pagenum = that.pagenum; |
|||
|
|||
var cid = that.curCid; |
|||
var bid = that.opt.bid ? that.opt.bid : ''; |
|||
var order = that.order; |
|||
|
|||
var field = that.field; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
var wherefield = {}; |
|||
wherefield.pagenum = pagenum; |
|||
wherefield.field = field; |
|||
wherefield.order = order; |
|||
wherefield.bid = bid; |
|||
if(bid > 0){ |
|||
wherefield.cid2 = cid; |
|||
}else{ |
|||
wherefield.cid = cid; |
|||
} |
|||
app.post('ApiLuckyCollage/getprolist',wherefield, function (res) { |
|||
that.loading = false; |
|||
|
|||
uni.stopPullDownRefresh(); |
|||
|
|||
var data = res.data; |
|||
if (data.length == 0) { |
|||
if(pagenum == 1){ |
|||
that.nodata = true; |
|||
}else{ |
|||
that.nomore = true; |
|||
} |
|||
} |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
}); |
|||
|
|||
}, |
|||
|
|||
scrolltolower: function () { |
|||
|
|||
if (!this.nomore) { |
|||
|
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdatalist(true); |
|||
|
|||
} |
|||
|
|||
}, |
|||
|
|||
//改变子分类 |
|||
|
|||
changeCTab: function (e) { |
|||
|
|||
var that = this; |
|||
|
|||
var id = e.currentTarget.dataset.id; |
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
|
|||
this.curIndex2 = index; |
|||
this.nodata = false; |
|||
|
|||
this.curCid = id; |
|||
|
|||
this.pagenum = 1; |
|||
|
|||
this.datalist = []; |
|||
|
|||
this.nomore = false; |
|||
|
|||
this.getdatalist(); |
|||
|
|||
}, |
|||
|
|||
//改变排序规则 |
|||
|
|||
changeOrder: function (e) { |
|||
|
|||
var t = e.currentTarget.dataset; |
|||
|
|||
this.field = t.field; |
|||
this.order = t.order; |
|||
|
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
this.nomore = false; |
|||
|
|||
this.getdatalist(); |
|||
|
|||
}, |
|||
|
|||
//事件处理函数 |
|||
|
|||
switchRightTab: function (e) { |
|||
|
|||
var that = this; |
|||
|
|||
var id = e.currentTarget.dataset.id; |
|||
|
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
|
|||
this.curIndex = index; |
|||
this.curIndex2 = -1; |
|||
this.nodata = false; |
|||
this.curCid = id |
|||
; |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
this.nomore = false; |
|||
|
|||
this.getdatalist(); |
|||
|
|||
} |
|||
, |
|||
buydialogChange: function (e) { |
|||
if(!this.buydialogShow){ |
|||
this.proid = e.currentTarget.dataset.proid |
|||
} |
|||
this.buydialogShow = !this.buydialogShow; |
|||
}, |
|||
} |
|||
|
|||
}; |
|||
</script> |
|||
<style> |
|||
page {height:100%;} |
|||
.container{width: 100%;height:100%;max-width:640px;background-color: #fff;color: #939393;display: flex;flex-direction:column} |
|||
.search-container {width: 100%;height: 94rpx;padding: 16rpx 23rpx 14rpx 23rpx;background-color: #fff;position: relative;overflow: hidden;border-bottom:1px solid #f5f5f5} |
|||
.search-box {display:flex;align-items:center;height:60rpx;border-radius:30rpx;border:0;background-color:#f7f7f7;flex:1} |
|||
.search-box .img{width:24rpx;height:24rpx;margin-right:10rpx;margin-left:30rpx} |
|||
.search-box .search-text {font-size:24rpx;color:#C2C2C2;width: 100%;} |
|||
|
|||
.content-container{flex:1;height:100%;display:flex;overflow: hidden;} |
|||
|
|||
.nav_left{width: 25%;height:100%;background: #ffffff;overflow-y:scroll;} |
|||
.nav_left .nav_left_items{line-height:50rpx;color:#999999;border-bottom:0px solid #E6E6E6;font-size:24rpx;position: relative;border-right:0 solid #E6E6E6;padding:25rpx 30rpx;} |
|||
.nav_left .nav_left_items.active{background: #fff;color:#222222;font-size:28rpx;font-weight:bold} |
|||
.nav_left .nav_left_items .before{display:none;position:absolute;top:50%;margin-top:-12rpx;left:10rpx;height:24rpx;border-radius:4rpx;width:8rpx} |
|||
.nav_left .nav_left_items.active .before{display:block} |
|||
|
|||
.nav_right{width: 75%;height:100%;display:flex;flex-direction:column;background: #f6f6f6;box-sizing: border-box;padding:20rpx 20rpx 0 20rpx} |
|||
.nav_right-content{height:100%} |
|||
.nav-pai{ width: 100%;display:flex;border-radius:10rpx; margin-bottom: 10rpx; align-items:center;justify-content:center; background: #fff;} |
|||
.nav-paili{flex:1; text-align:center;color:#323232; font-size:28rpx;font-weight:bold;position: relative;height:80rpx;line-height:80rpx;} |
|||
.nav-paili .iconshangla{position: absolute;top:-4rpx;padding: 0 6rpx;font-size: 20rpx;color:#7D7D7D} |
|||
.nav-paili .icondaoxu{position: absolute;top: 8rpx;padding: 0 6rpx;font-size: 20rpx;color:#7D7D7D} |
|||
|
|||
.classify-ul{width:100%;height:100rpx;padding:0 10rpx;} |
|||
.classify-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:22rpx;color:#6C737F;font-size:20rpx;text-align: center;height:44rpx; line-height:44rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
.classify-box{padding: 0 0 20rpx 0;width: 100%;height:calc(100% - 60rpx);overflow-y: scroll; border-top:1px solid #F5F6F8;} |
|||
.classify-box .nav_right_items{ width:100%;border-bottom:1px #f4f4f4 solid; padding:16rpx 0; box-sizing:border-box; position:relative; } |
|||
|
|||
.product-itemlist{height: auto; position: relative;overflow: hidden; padding: 0px; display:flex;flex-wrap:wrap} |
|||
.product-itemlist .item{width:100%;display: inline-block;position: relative;margin-bottom: 12rpx;background: #fff;padding:20rpx 14rpx;border-radius:10rpx;border-bottom:1px solid #F8F8F8} |
|||
.product-itemlist .product-pic {width: 160rpx;height:160rpx;overflow:hidden;background: #ffffff;padding-bottom: 30%;position: relative;border-radius:4px;} |
|||
.product-itemlist .product-pic .image{position:absolute;top:0;left:0;width: 100%;height:auto} |
|||
.product-itemlist .product-pic .saleimg{ position: absolute;width: 120rpx;height: auto; top: -6rpx; left:-6rpx;} |
|||
.product-itemlist .product-info {width: 70%;padding:0 10rpx 5rpx 20rpx;position: relative;} |
|||
.product-itemlist .product-info .name_1{ height: 46rpx;line-height: 46rpx;} |
|||
.product-itemlist .product-info .p1 {color:#323232;font-weight:bold;font-size:24rpx;line-height:35rpx;margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product-itemlist .product-info .p1 .team_text{ margin-right:10rpx;border-radius: 4rpx; color: #FF3143; background:#FFDED9 ; font-size: 20rpx; padding: 8rpx 6rpx;} |
|||
.product-itemlist .product-info .p2{ justify-content:space-between;height:36rpx;line-height:36rpx;overflow:hidden; margin-top: 20rpx;} |
|||
.product-itemlist .product-info .p2 .t1{font-size:32rpx; font-weight: bold;} |
|||
.product-itemlist .product-info .p2 .t2 {margin-left:10rpx;font-size:24rpx;color: #aaa;text-decoration: line-through;/*letter-spacing:-1px*/} |
|||
.product-itemlist .product-info .p3-1{font-size:20rpx;height:36rpx;line-height:36rpx;text-align:right;color:#999} |
|||
.product-itemlist .product-info .p4{width:48rpx;height:48rpx;border-radius:50%;position:absolute;display:relative;bottom:6rpx;right:4rpx;text-align:center;} |
|||
.product-itemlist .product-info .p4 .icon_gouwuche{font-size:28rpx;height:48rpx;line-height:48rpx} |
|||
.item .desc{ display: flex; margin-top: 15rpx;background:linear-gradient(to right, #FF3143, #FF8F99); justify-content: space-between; padding:0 10rpx; color: #fff;border-radius: 6rpx; line-height: 60rpx; font-size: 20rpx;} |
|||
::-webkit-scrollbar{width: 0;height: 0;color: transparent;} |
|||
</style> |
|||
@ -0,0 +1,200 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form-content"> |
|||
<view class="form-item1"> |
|||
<view class="label">商品信息</view> |
|||
<view class="product flex"> |
|||
<view class="img"><image :src="og.propic"></image></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{og.proname}}</view> |
|||
<view class="f2">{{og.ggname}}</view> |
|||
<view class="f3">¥{{og.sell_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item2 flex flex-y-center"> |
|||
<view class="label">您的打分</view> |
|||
<view class="i-rate" @touchmove="handleTouchMove"> |
|||
<input type="text" name="score" :value="score" class="i-rate-hide-input"></input> |
|||
<view v-for="(item, index) in 5" :key="index" class="i-rate-star" :class="( index < score ? 'i-rate-current':'' )" :data-index="index" @tap="handleClick"> |
|||
<image v-if="index < score" :src="event_rul +'/static/img/static/img/star2.png'"></image> |
|||
<image v-else :src="event_rul +'/static/img/static/img/star.png'"></image> |
|||
</view> |
|||
<view class="i-rate-text"></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item3 flex-col"> |
|||
<view class="label">您的评价</view> |
|||
<textarea placeholder="输入您的评价内容" placeholder-style="color:#ccc;" name="content" :value="comment.content" style="height:200rpx" :disabled="comment.id?true:false"></textarea> |
|||
</view> |
|||
|
|||
<view class="form-item4 flex-col"> |
|||
<view class="label">上传图片</view> |
|||
<view id="content_picpreview" class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view v-for="(item, index) in content_pic" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="content_pic" v-if="!comment.id"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" bindtap="xuanzhuan" data-index="{{index}}" data-field="content_pic" wx:if="{{!comment.id}}"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="content_pic" v-if="!comment.id && content_pic.length<5"></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<button class="btn" form-type="submit" :style="{background:t('color1')}" v-if="!comment.id">确定</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
og:{}, |
|||
comment:{}, |
|||
score: 0, |
|||
content_pic: [], |
|||
tempFilePaths: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/comment', {orderid: orderid}, function (res) { |
|||
that.loading = false; |
|||
that.og = res.og; |
|||
if (res.comment){ |
|||
that.comment = res.comment; |
|||
that.score = res.comment.score; |
|||
var content_pic = res.comment.content_pic; |
|||
that.content_pic = content_pic.split(','); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
var score = e.detail.value.score; |
|||
var content = e.detail.value.content; |
|||
var content_pic = that.content_pic; |
|||
if (score == 0) { |
|||
app.error('请打分'); |
|||
return; |
|||
} |
|||
if (content == '') { |
|||
app.error('请填写评价内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/comment', {orderid: orderid,content: content,content_pic: content_pic.join(','),score: score}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 2000); |
|||
}); |
|||
}, |
|||
handleClick: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.score = index + 1; |
|||
}, |
|||
handleTouchMove: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var clientWidth = uni.getSystemInfoSync().windowWidth; |
|||
if (!e.changedTouches[0]) return; |
|||
var movePageX = e.changedTouches[0].pageX; |
|||
var space = movePageX - 150 / 750 * clientWidth; |
|||
if (space <= 0) return; |
|||
var starwidth = 60 / 750 * clientWidth; |
|||
var setIndex = Math.ceil(space / starwidth); |
|||
setIndex = setIndex > 5 ? 5 : setIndex; |
|||
this.score = setIndex; |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
},1) |
|||
}, |
|||
removeimg:function(e){ |
|||
var that = this; |
|||
var index= e.currentTarget.dataset.index |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
pics.splice(index,1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-content{width:94%;margin:10rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;background:#fff;overflow:hidden} |
|||
.form-item1{ width:100%;background: #fff; padding: 8rpx 20rpx;} |
|||
.form-item1 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.product{ width: 100%; background: #fff; } |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f2{color: #a4a4a4; font-size:24rpx} |
|||
.product .info .f3{color: #ff0d51; font-size:28rpx} |
|||
.product image{ width:140rpx;height:140rpx} |
|||
|
|||
.form-item2{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item2 .label{ width:150rpx;height:60rpx;line-height:60rpx} |
|||
|
|||
.form-item3{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item3 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item3 textarea{width: 100%;border: 1px #dedede solid; border-radius: 10rpx; padding: 10rpx;height: 120rpx;} |
|||
|
|||
|
|||
.form-item4{width:100%;background: #fff; padding: 20rpx 20rpx;margin-top:1px} |
|||
.form-item4 .label{ width:150rpx;} |
|||
/*.form-item4 image{ width: 100rpx; height: 100rpx;background:#eee;margin-right:6rpx} |
|||
.form-item4 .imgbox{height:100rpx}*/ |
|||
|
|||
|
|||
.btn{ height:100rpx;line-height: 100rpx;width:90%;margin:0 auto;border-radius:50rpx;margin-top:50rpx;color: #fff;font-size: 30rpx;font-weight:bold} |
|||
|
|||
.i-rate{margin:0;padding:0;display:inline-block;vertical-align:middle;} |
|||
.i-rate-hide-input{display:none} |
|||
.i-rate-star{display:inline-block;color:#e9e9e9;padding:0 10rpx} |
|||
.i-rate-star image{width:50rpx;height:50rpx} |
|||
.i-rate-current{color:#f5a623} |
|||
.i-rate-text{display:inline-block;vertical-align:middle;margin-left:6px;font-size:14px} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="comment"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="item.headimg"/> |
|||
<view class="t2">{{item.nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (item.score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view style="color:#777;font-size:22rpx;">{{item.createtime}}</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="item.content_pic!=''"> |
|||
<block v-for="(itemp, index) in item.content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="item.content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
<text class="t3">规格:{{item.ggname}}</text> |
|||
</view> |
|||
<view class="f3" v-if="item.reply_content"> |
|||
<view class="arrow"></view> |
|||
<view class="t1">商家回复:{{item.reply_content}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata" text="暂无评价~"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiLuckyCollage/commentlist', {proid: that.opt.proid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{background:#fff} |
|||
.comment{display:flex;flex-direction:column;padding:10rpx 0;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{width:100%;padding:10rpx 0;position:relative} |
|||
.comment .item .f3 .arrow{width: 16rpx;height: 16rpx;background:#eee;transform: rotate(45deg);position:absolute;top:0rpx;left:36rpx} |
|||
.comment .item .f3 .t1{width:100%;border-radius:10rpx;padding:10rpx;font-size:22rpx;color:#888;background:#eee} |
|||
|
|||
</style> |
|||
@ -0,0 +1,183 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="navbg"></view> |
|||
<view class="nav"> |
|||
<scroll-view scroll-x="true" :scroll-left="top_bar_scroll"> |
|||
<view class="f1"> |
|||
<block v-for="(item, index) in navlist" :key="index"> |
|||
<view :class="'item ' + (selected==index?'active':'')" @tap="changetab" :data-index="index"> |
|||
<view class="t3">{{item.seckill_date_m}}</view> |
|||
<view class="t1">{{item.showtime}}</view> |
|||
<view class="t2" v-if="item.active==-1">已结束</view> |
|||
<view class="t2" v-if="item.active==0">已开抢</view> |
|||
<view class="t2" v-if="item.active==1">拼团中</view> |
|||
<view class="t2" v-if="item.active==2">即将开始</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
<view class="content"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<image class="f1" mode="widthFix" :src="item.pic" @tap="goto" :data-url="'product2?id=' + item.id"></image> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.name}}</text> |
|||
|
|||
<view class="t3"> |
|||
<view class="text1"> |
|||
<text class="x1" :style="{color:t('color1')}"><text style="font-size:24rpx">¥</text>{{item.sell_price}}</text> |
|||
<text class="x2">¥{{item.market_price}}</text> |
|||
</view> |
|||
<button @tap="goto" :data-url="'product2?id=' + item.id" class="x3" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}" v-if="item.istatus==1">立即抢购</button> |
|||
<button @tap="goto" :data-url="'product2?id=' + item.id" class="x3 xx1" v-else-if="item.istatus==-1">去看看</button> |
|||
<button @tap="goto" :data-url="'product2?id=' + item.id" class="x3" v-else :style="{background:t('color2')}">抢先看看</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="item" style="display:block" v-if="nodata"><nodata></nodata></view> |
|||
<nomore v-if="nomore"></nomore> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
bid:'', |
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
navlist: "", |
|||
activetime: "", |
|||
activeindex: "", |
|||
selected: "", |
|||
top_bar_scroll: "", |
|||
kaituan_duration: "", |
|||
nowtime: "", |
|||
nomore: false, |
|||
nodata:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st; |
|||
this.bid = this.opt.bid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getDataList(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.post('ApiLuckyCollage/index', {}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
} else { |
|||
that.navlist = res.navlist; |
|||
that.activetime = res.activetime; |
|||
that.activeindex = res.selected; |
|||
that.selected = res.selected; |
|||
that.top_bar_scroll = (res.selected - 2) * uni.getSystemInfoSync().windowWidth / 750 * 150; |
|||
that.kaituan_duration = res.kaituan_duration; |
|||
that.nowtime = res.nowtime; |
|||
that.getDataList(); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
changetab: function (e) { |
|||
var index = e.currentTarget.dataset.index; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.selected = index; |
|||
this.getDataList(); |
|||
}, |
|||
getDataList: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var selected = that.selected; |
|||
var navlist = that.navlist; |
|||
var pagenum = that.pagenum; |
|||
that.nomore = false; |
|||
that.nodata = false; |
|||
app.post('ApiLuckyCollage/getprolist2', {bid:that.bid,kaituan_date: navlist[selected].kaituan_date,kaituan_time: navlist[selected].kaituan_time,pagenum: pagenum}, function (res) { |
|||
uni.stopPullDownRefresh(); |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{width:100%;overflow:hidden} |
|||
.navbg{width: 100%;position:relative} |
|||
.navbg:after {background: linear-gradient(90deg,rgba(253, 74, 70, 1) 0%,rgba(253, 74, 70, 0.8) 100%);content: '';width: 160%;height:300rpx;position: absolute;left: -30%;top:0;border-radius: 0 0 50% 50%;z-index:1} |
|||
.nav {width: 100%;position:relative;z-index:2} |
|||
.nav>scroll-view {overflow: visible !important;padding-top:20rpx;padding-bottom:20rpx} |
|||
.nav .f1 {flex-grow: 0;flex-shrink: 0;display:flex;align-items:center;color:#fff;position:relative;z-index:2} |
|||
.nav .f1 .item{flex-grow: 0;flex-shrink: 0;width:150rpx;text-align:center;padding:16rpx 0;opacity: 0.6;} |
|||
.nav .f1 .item .t1 {font-size:34rpx;font-weight:bold} |
|||
.nav .f1 .item .t2 {font-size:24rpx} |
|||
.nav .f1 .item .t3 {font-size:30rpx;} |
|||
|
|||
.nav .f1 .item.active {position: relative;color:#fff;opacity:1} |
|||
|
|||
.content{width:94%;margin-left:3%;position:relative;z-index:3} |
|||
.data-empty{background:#fff;border-radius:16rpx} |
|||
.content .item{width:100%;display:flex;padding: 20rpx;background:#fff;border-radius:16rpx;margin-bottom:20rpx} |
|||
.item .f1{width:200rpx;height:200rpx;margin-right:20rpx;} |
|||
.item .f2{position: relative; padding-right: 20rpx;flex:1;display:flex;flex-direction:column} |
|||
.item .f2 .t1{font-size:28rpx;font-weight:bold;color: #222;margin-top: 2px;height:80rpx;overflow:hidden} |
|||
.item .f2 .t2{width:100%;margin-top:12rpx;display:flex;align-items:center} |
|||
.item .f2 .t2 .x2{padding-left:16rpx;font-size:24rpx;font-weight:bold} |
|||
.item .f2 .t3{width:100%;margin-top:20rpx;display:flex;align-items:flex-end} |
|||
.item .f2 .t3 .x1{font-size:32rpx;font-weight:bold} |
|||
.item .f2 .t3 .x2{color:#999999;font-size:24rpx;text-decoration:line-through;padding-left:8rpx} |
|||
.item .f2 .t3 .x3{position:absolute;bottom:0;right:0;border: 0;color: #fff;font-size:28rpx;padding:0 28rpx;height:54rpx;line-height:50rpx;border-radius:54rpx;margin:0} |
|||
.item .f2 .t3 .x3.xx1{background:#888} |
|||
.item .f2 .t3 .text1{margin-top: 40rpx;} |
|||
.progress{width:240rpx;font-size:24rpx} |
|||
.nomore-footer-tips{background:#fff!important} |
|||
</style> |
|||
@ -0,0 +1,340 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择货到付款' : '已成功付款'}}</view> |
|||
|
|||
<block v-if="detail.buytype!=1"> |
|||
<view class="t2" v-if="team.status==1">拼团中</view> |
|||
<view class="t2" v-if="team.status==2 && detail.freight_type!=1">拼团成功,我们会尽快为您发货</view> |
|||
<view class="t2" v-if="team.status==2 && detail.freight_type==1">拼团成功,请尽快前往自提地点取货</view> |
|||
<view class="t2" v-if="team.status==3">拼团失败,已退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</block> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" user-select="true" selectable="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul + '/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true" selectable="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1" user-select="true" selectable="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true" selectable="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="product"> |
|||
<view class="content"> |
|||
<view @tap="goto" :data-url="'product?id=' + detail.proid"> |
|||
<image :src="detail.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{detail.proname}}</text> |
|||
<text class="t2">{{detail.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{detail.sell_price}}</text><text class="x2">×{{detail.num}}</text></view> |
|||
</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==0 && shopset.comment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">去评价</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">查看评价</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true" selectable="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{detail.product_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.leveldk_money > 0"> |
|||
<text class="t1">{{t('会员')}}折扣</text> |
|||
<text class="t2 red">-¥{{detail.leveldk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.coupon_money > 0"> |
|||
<text class="t1">{{t('优惠券')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.coupon_money}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.scoredk_money > 0"> |
|||
<text class="t1">{{t('积分')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.scoredk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<block v-if="detail.status==1"> |
|||
<block v-if="detail.buytype!=1"> |
|||
<text v-if="team.status==1" class="t2">拼团中</text> |
|||
<text v-if="team.status==2 && detail.freight_type!=1" class="t2">拼团成功,待发货</text> |
|||
<text v-if="team.status==2 && detail.freight_type==1" class="t2">拼团成功,待提货</text> |
|||
<text v-if="team.status==3" class="t2">拼团失败,已退款</text> |
|||
</block> |
|||
<block v-else> |
|||
<text v-if="detail.freight_type!=1" class="t2">待发货</text> |
|||
<text v-if="detail.freight_type==1" class="t2">待提货</text> |
|||
</block> |
|||
</block> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.money>0"> |
|||
<text class="t1">未中奖红包</text> |
|||
<text class="t2 red" >¥{{detail.money}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true" selectable="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot" v-if="detail.status!=3"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
|
|||
|
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
|
|||
<block v-if="([1,2,3]).includes(detail.status) && invoice && team.status==2"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=lucky_collage&orderid=' + detail.id">发票</view> |
|||
</block> |
|||
<block v-if="(detail.buytype==1 || team.status==2) && (detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3"> |
|||
<view class="btn2">已完成</view> |
|||
</block> |
|||
<block v-if="detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul + '/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
textset:{}, |
|||
detail:{}, |
|||
team:{}, |
|||
storeinfo:{}, |
|||
shopset:{}, |
|||
invoice:0, |
|||
event_rul: app.globalData.event_url, |
|||
} |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function (option) { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.detail = res.detail; |
|||
that.team = res.team; |
|||
that.storeinfo = res.storeinfo; |
|||
that.shopset = res.shopset; |
|||
that.textset = app.globalData.textset; |
|||
that.invoice = res.invoice; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiLuckyCollage/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;position:relative} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{height:80rpx;line-height:40rpx;color: #000;} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px; left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;background:#FB4343;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,233 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['全部','待付款','待发货','待收货','已完成','退款']" :itemst="['all','0','1','2','3','10']" :st="st" :isfixed="true" @changetab="changetab"></dd-tab> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap.stop="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<text class="flex1">订单号:{{item.ordernum}}</text> |
|||
<text v-if="item.status==0" class="st0">待付款</text> |
|||
<block v-if="item.status==1"> |
|||
<block v-if="item.buytype!=1"> |
|||
<text v-if="item.team.status==1" class="st1">拼团中</text> |
|||
<text v-if="item.team.status==2 && item.freight_type!=1" class="st1">拼团成功,待发货</text> |
|||
<text v-if="item.team.status==2 && item.freight_type==1" class="st1">拼团成功,待提货</text> |
|||
<text v-if="item.team.status==3" class="st4">拼团失败,已退款</text> |
|||
</block> |
|||
<block v-else> |
|||
<text v-if="item.freight_type!=1" class="st1">待发货</text> |
|||
<text v-if="item.freight_type==1" class="st1">待提货</text> |
|||
</block> |
|||
</block> |
|||
|
|||
<text v-if="item.status==2" class="st2">待收货</text> |
|||
<text v-if="item.status==3" class="st3">已完成</text> |
|||
<text v-if="item.status==4" class="st4">已关闭</text> |
|||
</view> |
|||
|
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item.proid"> |
|||
<image :src="item.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.proname}}</text> |
|||
<text class="t2">{{item.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{item.sell_price}}</text><text class="x2">×{{item.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="bottom"> |
|||
<text>共计{{item.num}}件商品 实付:¥{{item.totalprice}}</text> |
|||
<text v-if="item.refund_status==1" style="color:red"> 退款中¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==2" style="color:red"> 已退款¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==3" style="color:red"> 退款申请已驳回</text> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="([1,2,3]).includes(item.status) && item.invoice && item.team.status==2"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=lucky_collage&orderid=' + item.id">发票</view> |
|||
</block> |
|||
<view @tap.stop="goto" :data-url="'orderdetail?id=' + item.id" class="btn2">详情</view> |
|||
<view @tap.stop="goto" :data-url="'team?teamid=' + item.teamid" class="btn2" v-if="item.buytype!=1">查看团</view> |
|||
<block v-if="item.status==0"> |
|||
<view class="btn2" @tap.stop="toclose" :data-id="item.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="goto" :data-url="'/pages/pay/pay?id=' + item.payorderid">去付款</view> |
|||
</block> |
|||
|
|||
<block v-if="item.status==2"> |
|||
|
|||
<view class="btn2" @tap.stop="goto" :data-url="'/pages/order/logistics?express_com=' + item.express_com + '&express_no=' + item.express_no" v-if="item.freight_type!=3 && item.freight_type!=4">查看物流</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="orderCollect" :data-id="item.id">确认收货</view> |
|||
</block> |
|||
<block v-if="item.status==4"> |
|||
<view class="btn2" @tap.stop="todel" :data-id="item.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiLuckyCollage/orderlist', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiLuckyCollage/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.order-tab{position:fixed;top:var(--window-top);z-index:11;display:flex;width:100%; height:90rpx;border-bottom: 1px #f4f4f4 solid;background: #fff; margin-bottom: 10rpx;} |
|||
.order-tab .item{flex:1;font-size:28rpx; text-align: center; color:#666; height: 90rpx; line-height: 90rpx; overflow: hidden;position:relative} |
|||
.order-tab .on{color: #323233;} |
|||
.order-tab .on:after{content:'';position:absolute;left:50%;margin-left:-40rpx;bottom:0;height:3px;border-radius:1.5px;background:#ff4a03;width:80rpx} |
|||
|
|||
.container{ width:100%;margin-top:90rpx} |
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
.order-box .head .st0{ width: 140rpx; color: #ff8758; text-align: right; } |
|||
.order-box .head .st1{ width: 204rpx; color: #ffc702; text-align: right; } |
|||
.order-box .head .st2{ width: 204rpx; color: #ff4246; text-align: right; } |
|||
.order-box .head .st3{ width: 140rpx; color: #999; text-align: right; } |
|||
.order-box .head .st4{ width: 140rpx; color: #bbb; text-align: right; } |
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;flex-wrap: wrap;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
/*.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px; font-size: 14px; position: absolute; bottom: 10px; right: 10px; background: #fff; }*/ |
|||
.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px;} |
|||
|
|||
.zan-tex{clear:both; display: block; width: 100%; color: #565656; font-size: 12px; height: 30px; line-height: 30px; text-align: center; } |
|||
.ind-bot{ width: 100%; float: left; text-align: center; height: 50px; line-height: 50px; font-size: 13px; color: #ccc; background:#F2F2F2} |
|||
|
|||
</style> |
|||
@ -0,0 +1,653 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="containerbox"> |
|||
<view class="swiper-container"> |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{product.pics.length}}</view> |
|||
</view> |
|||
|
|||
<view class="collage_title"> |
|||
<view class="f1"> |
|||
<view class="t1"> |
|||
<view class="x1">¥</view> |
|||
<view class="x2">{{product.sell_price}}</view> |
|||
<view class="t2">¥{{product.market_price}}</view> |
|||
<view class="x3">{{product.teamnum}}人拼</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="f2">已拼{{product.sales}}件</view> |
|||
</view> |
|||
</view> |
|||
<view class="header"> |
|||
<view class="title"> |
|||
<view class="lef"> |
|||
<text>{{product.name}}</text> |
|||
</view> |
|||
<view class="share" @tap="shareClick"> |
|||
<image :src="event_rul +'/static/img/static/img/share.png'"></image> |
|||
<text>分享</text> |
|||
</view> |
|||
</view> |
|||
<view class="title2 flex"> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_1.png'"></image><view class="t1">参与拼团</view><view class="t1"><text class="t1_1">{{product.teamnum}}</text>人成团</view></view> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_2.png'"></image><view class="t1"><text class="t1_1">{{product.gua_num}}</text>人拼中发货</view><view class="t1"><text class="t1_1">{{product.teamnum-product.gua_num}}</text>人未中退款</view></view> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_3.png'"></image><view class="t1">未中补贴</view><view class="t1"><text class="t1_1">{{product.fy_money_val}}</text>元参与奖</view></view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<view class="teamlist" v-if="teamCount > 0"> |
|||
<view class="label"><view class="after" :style="{background:t('color1')}"></view>{{teamCount}}人在拼单,可直接参与</view> |
|||
<scroll-view :scroll-y="true" class="content"> |
|||
<view v-for="(item, index) in teamList" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image :src="item.headimg"></image> |
|||
<image :src="event_rul +'/static/img/static/img/wh.png'" class="img1"></image> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">还差{{item.teamnum - item.num}}人拼成</view> |
|||
<view class="t2">剩余{{item.djs}}</view> |
|||
</view> |
|||
<button class="f3" @tap="buydialogShow" data-btntype="3" :data-teamid="item.id">去参团</button> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<view class="commentbox" v-if="shopset.comment==1 && commentcount > 0"> |
|||
<view class="title"> |
|||
<view class="f1">评价({{commentcount}})</view> |
|||
<view class="f2" @tap="goto" :data-url="'commentlist?proid=' + product.id">好评度 <text :style="{color:t('color1')}">{{product.comment_haopercent}}%</text><image style="width:32rpx;height:32rpx;" :src="event_rul +'/static/img/static/img/arrowright.png'"/></view> |
|||
</view> |
|||
<view class="comment"> |
|||
<view class="item" v-if="commentlist.length>0"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="commentlist[0].headimg"/> |
|||
<view class="t2">{{commentlist[0].nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul + '/static/img/static/img/star' + (commentlist[0].score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{commentlist[0].content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="commentlist[0].content_pic!=''"> |
|||
<block v-for="(itemp, index) in commentlist[0].content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="commentlist[0].content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" @tap="goto" :data-url="'commentlist?proid=' + product.id">查看全部评价</view> |
|||
</view> |
|||
<view v-else class="nocomment">暂无评价~</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="shop" v-if="shopset.showjd==1"> |
|||
<image :src="business.logo" class="p1"/> |
|||
<view class="p2 flex1"> |
|||
<view class="t1">{{business.name}}</view> |
|||
<view class="t2">{{business.desc}}</view> |
|||
</view> |
|||
<button class="p4" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" :data-url="product.bid==0?'/pages/index/index':'/pages/business/index?id='+product.bid" data-opentype="reLaunch">进入店铺</button> |
|||
</view> |
|||
<view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">商品描述</view><view class="t2"></view><view class="t1"></view></view> |
|||
<view class="detail"> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
</view> |
|||
|
|||
|
|||
<view style="width:100%;height:70px;"></view> |
|||
|
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':'notabbarbot'" v-if="product.status==1"> |
|||
<view class="f1"> |
|||
<view class="item" @tap="goto" :data-url="'prolist?bid='+product.bid"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/shou.png'"/> |
|||
<view class="t1">首页</view> |
|||
</view> |
|||
<view class="item " @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="item" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
<view class="item" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<view class="tocart" :style="{background:t('color2')}" @tap="buydialogShow" data-btntype="1"><text>¥{{product.market_price}}</text><text>单独购买</text></view> |
|||
<view class="tobuy" :style="{background:t('color1')}" @tap="buydialogShow" data-btntype="2"><text>¥{{product.sell_price}}</text><text>发起拼团</text></view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view :hidden="buydialogHidden"> |
|||
<view class="buydialog-mask"> |
|||
<view class="buydialog" :class="menuindex>-1?'tabbarbot':'notabbarbot'"> |
|||
<view class="close" @tap="buydialogChange"> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="image"></image> |
|||
</view> |
|||
<view class="title"> |
|||
<image :src="guigelist[ks].pic?guigelist[ks].pic:product.pic" class="img" @tap="previewImage" :data-url="guigelist[ks].pic?guigelist[ks].pic:product.pic"></image> |
|||
<!-- <text class="name">{{product.name}}</text> --> |
|||
<view class="price" v-if="btntype==1"><text class="t1">¥</text>{{guigelist[ks].market_price}}</view> |
|||
<view class="price" v-else><text class="t1">¥</text>{{guigelist[ks].sell_price}} <text v-if="guigelist[ks].market_price > guigelist[ks].sell_price" class="t2">¥{{guigelist[ks].market_price}}</text></view> |
|||
<view class="choosename">已选规格: {{guigelist[ks].name}}</view> |
|||
<view class="stock">剩余{{guigelist[ks].stock}}件</view> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in guigedata" :key="index" class="guigelist flex-col"> |
|||
<view class="name">{{item.title}}</view> |
|||
<view class="item flex flex-y-center"> |
|||
<block v-for="(item2, index2) in item.items" :key="index2"> |
|||
<view :data-itemk="item.k" :data-idx="item2.k" :class="'item2 ' + (ggselected[item.k]==item2.k ? 'on':'')" @tap="ggchange">{{item2.title}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="flex1">购买数量:</view> |
|||
<view class="addnum"> |
|||
<view class="minus"><image class="img" :src="event_rul +'/static/img/static/img/cart-minus.png'" @tap="gwcminus"/></view> |
|||
<input class="input" type="number" :value="gwcnum" @input="gwcinput"></input> |
|||
<view class="plus"><image class="img" :src="event_rul +'/static/img/static/img/cart-plus.png'" @tap="gwcplus"/></view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="btntype==1"> |
|||
<button class="tobuy" :style="{background:t('color2')}" @tap="tobuy" data-type="1">确定</button> |
|||
</block> |
|||
<block v-if="btntype==2"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="2">下一步</button> |
|||
</block> |
|||
<block v-if="btntype==3"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="3">确 定</button> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul +'/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
indexurl:app.globalData.indexurl, |
|||
tabnum: 1, |
|||
buydialogHidden: true, |
|||
num: 1, |
|||
teamCount:0, |
|||
sysset:{}, |
|||
shopset:{}, |
|||
isfavorite: false, |
|||
btntype: 1, |
|||
ggselected: [], |
|||
guigedata:[], |
|||
guigelist:[], |
|||
ks: '', |
|||
gwcnum: 1, |
|||
nodata: 0, |
|||
product:{}, |
|||
userinfo: [], |
|||
current: 0, |
|||
pagecontent: "", |
|||
business:{}, |
|||
commentcount:0, |
|||
commentlist:[], |
|||
nowtime: "", |
|||
teamList: [], |
|||
teamid: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
kfurl:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var id = that.opt.id; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/product', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var pagecontent = JSON.parse(res.product.detail); |
|||
that.pagecontent = pagecontent; |
|||
that.business = res.business; |
|||
that.commentcount = res.commentcount; |
|||
that.commentlist = res.commentlist; |
|||
that.ggselected = res.ggselected; |
|||
that.guigedata = res.guigedata; |
|||
that.guigelist = res.guigelist; |
|||
that.isfavorite = res.isfavorite; |
|||
that.ks = res.ks; |
|||
that.nowtime = res.nowtime; |
|||
that.product = res.product; |
|||
that.shopset = res.shopset; |
|||
that.sysset = res.sysset; |
|||
that.teamCount = res.teamCount; |
|||
that.teamList = res.teamList; |
|||
setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
uni.setNavigationBarTitle({ |
|||
title: res.product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+res.product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.loaded({title:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current; |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var nowtime = that.nowtime; |
|||
for (var i in that.teamList) { |
|||
var thisteam = that.teamList[i]; |
|||
var totalsec = thisteam.createtime * 1 + thisteam.teamhour * 3600 - nowtime * 1; |
|||
if (totalsec <= 0) { |
|||
that.teamList[i].djs = '00时00分00秒'; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
} |
|||
that.teamList[i].djs = djs; |
|||
} |
|||
}, |
|||
//加入购物车 |
|||
buydialogShow: function (e) { |
|||
var btntype = e.currentTarget.dataset.btntype; |
|||
if (btntype == 3) { |
|||
this.teamid = e.currentTarget.dataset.teamid |
|||
} |
|||
this.btntype = btntype; |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
buydialogChange: function (e) { |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
//选择规格 |
|||
ggchange: function (e) { |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var itemk = e.currentTarget.dataset.itemk; |
|||
var ggselected = this.ggselected; |
|||
ggselected[itemk] = idx; |
|||
var ks = ggselected.join(','); |
|||
this.ggselected = ggselected; |
|||
this.ks = ks; |
|||
}, |
|||
tobuy: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var ks = that.ks; |
|||
var proid = that.product.id; |
|||
var ggid = that.guigelist[ks].id; |
|||
var num = that.gwcnum; |
|||
var shareid = that.opt.pid; |
|||
app.goto('buy?proid=' + proid + '&ggid=' + ggid + '&num=' + num + '&shareid='+shareid+'&buytype=' + type + (type == 3 ? '&teamid=' + that.teamid : '')); |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var gwcnum = this.gwcnum + 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum + 1 |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var gwcnum = this.gwcnum - 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum <= 0) { |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum - 1 |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var ggselected = this.ks; |
|||
var gwcnum = parseInt(e.detail.value); |
|||
if (gwcnum < 1) return 1; |
|||
|
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
return this.guigelist[ggselected].stock; |
|||
} |
|||
this.gwcnum = gwcnum; |
|||
}, |
|||
//收藏操作 |
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.showLoading('收藏中'); |
|||
app.post('ApiLuckyCollage/addfavorite', {proid: proid,type: 'luckycollage'}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
tabClick: function (e) { |
|||
this.tabnum = e.currentTarget.dataset.num; |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiLuckyCollage/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false;; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/luckycollage/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/luckycollage/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 750rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
.containerbox{ position: relative;} |
|||
|
|||
.header {width: 95%;padding: 0 3%;background: #fff; margin:0 20rpx;border-radius: 0px 0px 16rpx 16rpx;} |
|||
.header .title {padding: 10px 0px;line-height:44rpx;font-size:32rpx;display:flex;} |
|||
.header .title .lef{display:flex;flex-direction:column;justify-content: center;flex:1;color:#222222;font-weight:bold} |
|||
.header .title .lef .t2{ font-size:26rpx;color:#999;padding-top:10rpx;font-weight:normal} |
|||
.header .title .share{width:88rpx;height:88rpx;padding-left:20rpx;border-left:0 solid #f5f5f5;text-align:center;font-size:24rpx;color:#222;display:flex;flex-direction:column;align-items:center} |
|||
.header .title .share image{width:32rpx;height:32rpx;margin-bottom:4rpx} |
|||
|
|||
.header .price{height: 86rpx;overflow: hidden;line-height: 86rpx;border-top: 1px solid #eee;} |
|||
.header .price .t1 .x1{ color: #e94745; font-size: 34rpx;} |
|||
.header .price .t1 .x2{ color: #939393; margin-left: 10rpx; text-decoration: line-through;font-size:24rpx} |
|||
.header .price .t2{color: #aaa; font-size: 24rpx;} |
|||
.header .fuwupoint{width:100%;font-size:24rpx;color:#999;display:flex;flex-wrap:wrap;border-top:1px solid #eee;padding:10rpx 0} |
|||
.header .fuwupoint .t{ padding:4rpx 20rpx 4rpx 0} |
|||
.header .fuwupoint .t:before{content: ""; display: inline-block; vertical-align: middle; margin-top: -4rpx; margin-right: 10rpx; width: 24rpx; height: 24rpx; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUdwTOU5O+Q5POU5POQ4O+U4PN80P+M4O+Q4O+Q4POQ5POQ4OuQ4O+Q4O+I4PuQ5PJxkAycAAAAPdFJOUwAf+VSoeAvzws7ka7miLboUzckAAADJSURBVBjTY2BgYGCMWVR5VIABDBid/gPBFwjP/JOzQKKtfjGIzf3fEUSJ/N8AJO21Iao3fQbqqA+AcLi/CzCwfGGAAn8HBnlFMIttBoP4R4b4C2BOzk8G3q8M5w3AnPsLGZj/MKwHW8b6/QED4y8G/QQQx14ZSHwCcWYkMOtvAHOAyvqnPf8KcuMvkAGZP9eDjAQaEO/AwDb/D0gj0GiQpRnTQIYIfUR1DopDGexVIZygz8ieC4B6WyzRBOJtBkZ/pAABBZUWOKgAispF5e7ibycAAAAASUVORK5CYII=') no-repeat; background-size: 24rpx auto; } |
|||
.choose{ display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; height: 80rpx; line-height: 80rpx; padding: 0 3%; color: #505050; } |
|||
.choose .f2{ width: 40rpx; height: 40rpx;} |
|||
|
|||
.teamlist{ width:95%;margin:0 20rpx;border-radius: 16rpx; background:#fff;padding:10rpx 20rpx;font-size:26rpx;margin-top:20rpx;display:flex;flex-direction:column} |
|||
.teamlist .label{ padding-left: 30rpx; height: 100rpx; position: relative; width:100%;color:#222222;font-weight:bold; line-height: 80rpx;} |
|||
.teamlist .label .after{display:block;position:absolute;border-right:10rpx solid red;top:20rpx;left:10rpx;height:36rpx; border-radius:1.5px;} |
|||
.teamlist .content{ width:100%;max-height:300rpx;overflow:scroll} |
|||
.teamlist .item{width:100%;display:flex;align-items:center;padding:12rpx 3px;border-bottom:0px solid #f5f5f5} |
|||
.teamlist .item .f1{overflow:hidden;display:flex;align-items:center} |
|||
.teamlist .item .f1 image{width:80rpx;height:80rpx; border-radius: 50%;} |
|||
.teamlist .item .f1 .img1{ position: absolute;left:10%; background: #D9D9D9; } |
|||
.teamlist .item .f1 .t1{padding-left:6rpx;font-size:30rpx;color:#333} |
|||
.teamlist .item .f2{ margin:0 8rpx; width: 160px; margin-left: 50px;} |
|||
.teamlist .item .f2 .t1{font-size:24rpx;color:#333} |
|||
.teamlist .item .f2 .t2{font-size:22rpx;color:#999} |
|||
.teamlist .item .f3{ background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);color:#fff;border-radius:26rpx;padding:0 20rpx;height:50rpx;border:0;text-align:right;font-size:26rpx;display:flex;align-items:center} |
|||
.teamlist .item .f3:after{border:0} |
|||
|
|||
|
|||
.shop{width:95%;margin:0 20rpx;display:flex;align-items:center; border-radius: 16rpx; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 136rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:50%;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:60rpx;margin-bottom:30rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.commentbox{width:100%;background:#fff;padding:0 3%;margin-top:20rpx} |
|||
.commentbox .title{height:90rpx;line-height:90rpx;border-bottom:1px solid #DDDDDD;display:flex} |
|||
.commentbox .title .f1{flex:1;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.commentbox .title .f2{color:#333;font-weight:bold;font-size:28rpx;display:flex;align-items:center} |
|||
.commentbox .nocomment{height:100rpx;line-height:100rpx} |
|||
|
|||
.comment{display:flex;flex-direction:column;min-height:200rpx;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{margin:20rpx auto;padding:0 30rpx;height:60rpx;line-height:60rpx;border:1px solid #E6E6E6;border-radius:30rpx;color:#111111;font-weight:bold;font-size:26rpx} |
|||
|
|||
.bottombar{ width: 96%; position: fixed;bottom: 0px; left: 0px; background: #fff;display:flex;height:120rpx;padding:0 2% 0 2%;align-items:center;box-sizing:content-box} |
|||
.bottombar .f1{flex:1;display:flex;align-items:center;margin-right:10rpx} |
|||
.bottombar .f1 .item{display:flex;flex-direction:column;align-items:center;width:90rpx;position:relative} |
|||
.bottombar .f1 .item .img{ width:44rpx;height:44rpx} |
|||
.bottombar .f1 .item .t1{font-size:18rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
|
|||
.bottombar .op{width:60%;border-radius:36rpx;overflow:hidden;display:flex;} |
|||
.bottombar .tocart{ width:50%; height: 100rpx;color: #fff; border-radius: 88rpx 0px 0px 88rpx;background: #fa938a; font-size: 28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.bottombar .tobuy{ width:50%; height: 100rpx;color: #fff; border-radius: 0px 88rpx 88rpx 0px;background: #df2e24; font-size:28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
|
|||
|
|||
.buydialog-mask{ position: fixed; top: 0px; left: 0px; width: 100%; background: rgba(0,0,0,0.5); bottom: 0px;z-index:10} |
|||
.buydialog{ position: fixed; width: 100%; left: 0px; bottom: 0px; background: #fff;z-index:11;border-radius:20rpx 20rpx 0px 0px} |
|||
.buydialog .close{ position: absolute; top: 0; right: 0;padding:20rpx;z-index:12} |
|||
.buydialog .close .image{ width: 30rpx; height:30rpx; } |
|||
.buydialog .title{ width: 94%;position: relative; margin: 0 3%; padding:20rpx 0px; border-bottom:0; height: 190rpx;} |
|||
.buydialog .title .img{ width: 160rpx; height: 160rpx; position: absolute; top: 20rpx; border-radius: 10rpx; border: 0 #e5e5e5 solid;background-color: #fff} |
|||
.buydialog .title .price{ padding-left:180rpx;width:100%;font-size: 36rpx;height:70rpx; color: #FC4343;overflow: hidden;} |
|||
.buydialog .title .price .t1{ font-size:26rpx} |
|||
.buydialog .title .price .t2{ font-size:26rpx;text-decoration:line-through;color:#aaa} |
|||
.buydialog .title .choosename{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
.buydialog .title .stock{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
|
|||
.buydialog .guigelist{ width: 94%; position: relative; margin: 0 3%; padding:0px 0px 10px 0px; border-bottom: 0; } |
|||
.buydialog .guigelist .name{ height:70rpx; line-height: 70rpx;} |
|||
.buydialog .guigelist .item{ font-size: 30rpx;color: #333;flex-wrap:wrap} |
|||
.buydialog .guigelist .item2{ height:60rpx;line-height:60rpx;margin-bottom:4px;border:0; border-radius:4rpx; padding:0 40rpx;color:#666666; margin-right: 10rpx; font-size:26rpx;background:#F4F4F4} |
|||
.buydialog .guigelist .on{color:#FC4343;background:rgba(252,67,67,0.1);font-weight:bold} |
|||
.buydialog .buynum{ width: 94%; position: relative; margin: 0 3%; padding:10px 0px 10px 0px; } |
|||
.buydialog .addnum {font-size: 30rpx;color: #666;width:auto;display:flex;align-items:center} |
|||
.buydialog .addnum .plus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .minus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .img{width:24rpx;height:24rpx} |
|||
.buydialog .addnum .input{flex:1;width:70rpx;border:0;text-align:center;color:#2B2B2B;font-size:24rpx} |
|||
.buydialog .op{width:90%;margin:20rpx 5%;border-radius:36rpx;overflow:hidden;display:flex;margin-top:100rpx;} |
|||
.buydialog .addcart{flex:1;height:72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none; font-size:28rpx;font-weight:bold} |
|||
.buydialog .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;} |
|||
.buydialog .nostock{flex:1;height: 72rpx; line-height: 72rpx; background:#aaa; color: #fff; border-radius: 0px; border: none;} |
|||
|
|||
.collage_title{width:95%;height:110rpx; position: absolute; bottom: 0; background-image: url('https://v2d.diandashop.com/static/img/xypt_bg.png'); background-size: 100%; display:flex;align-items:center;padding:0 40rpx; margin:0 20rpx;} |
|||
.collage_title .f1{flex:1;display:flex;flex-direction:column;} |
|||
.collage_title .f1 .t1{display:flex;align-items:center;height:60rpx;line-height:60rpx; margin-top: 20rpx;} |
|||
.collage_title .f1 .t1 .x1{font-size:28rpx;color:#fff} |
|||
.collage_title .f1 .t1 .x2{font-size:48rpx;color:#fff;padding-right:20rpx} |
|||
.collage_title .f1 .t1 .x3{margin-left: 60rpx;font-size:24rpx;font-weight:bold;height:40rpx;line-height:40rpx;padding:0 20rpx;border-radius:20rpx;background:#fff;color:#ED533A} |
|||
.collage_title .f1 .t2{color:rgba(255,255,255,0.6);font-size:20rpx;text-decoration: line-through;margin-top: 10rpx;} |
|||
.collage_title .f2{color:#fff;font-size:28rpx;} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
|
|||
.title2{ align-items: center; padding-bottom: 20rpx;} |
|||
.title2 .p1{ font-size: 20rpx;border-bottom-right-radius:40rpx; margin: auto; width: 30%;padding:30rpx 0; text-align: center; border: 1rpx solid #FF3143; border: 1px solid rgba(255, 49, 67, 0.2); margin-right: 10rpx;} |
|||
.title2 .t1{ line-height: 40rpx;} |
|||
.title2 .t1 .t1_1{ color:#FF3143} |
|||
.title2 image{ width: 80rpx; height: 80rpx;} |
|||
</style> |
|||
@ -0,0 +1,718 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="containerbox"> |
|||
<view class="swiper-container"> |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{product.pics.length}}</view> |
|||
</view> |
|||
|
|||
<view class="collage_title"> |
|||
<view class="f1"> |
|||
<view class="t1"> |
|||
<view class="x1">¥</view> |
|||
<view class="x2">{{product.sell_price}}</view> |
|||
<view class="t2">¥{{product.market_price}}</view> |
|||
<view class="x3">{{product.teamnum}}人团</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view v-if="product.isktdate==1"> |
|||
<view class="f2" v-if="kaituan_status==0 || kaituan_status==1"> |
|||
<view class="t1">距{{kaituan_status==0?'开始':'结束'}}还剩</view> |
|||
<view class="t2" id="djstime"><text class="djsspan">{{djshour}}</text> : <text class="djsspan">{{djsmin}}</text> : <text class="djsspan">{{djssec}}</text></view> |
|||
</view> |
|||
<view class="f2" v-if="kaituan_status==2"> |
|||
<view class="t1">今日已结束</view> |
|||
</view> |
|||
</view> |
|||
<view v-else> |
|||
<view class="f2">已团{{product.sales}}件</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="header"> |
|||
<view class="title"> |
|||
<view class="lef"> |
|||
<text>{{product.name}}</text> |
|||
</view> |
|||
<view class="share" @tap="shareClick"> |
|||
<image :src="event_rul +'/static/img/static/img/share.png'"></image> |
|||
<text>分享</text> |
|||
</view> |
|||
</view> |
|||
<view class="title2 flex"> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_1.png'"></image><view class="t1">参与拼团</view><view class="t1"><text class="t1_1">{{product.teamnum}}</text>人成团</view></view> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_2.png'"></image><view class="t1"><text class="t1_1">{{product.gua_num}}</text>人拼中发货</view><view class="t1"><text class="t1_1">{{product.teamnum-product.gua_num}}</text>人未中退款</view></view> |
|||
<view class="p1"> |
|||
<image :src="event_rul +'/static/img/static/img/pintuan_3.png'"></image><view class="t1">未中补贴</view> |
|||
<view class="t1" v-if="product.bzjl_type==1"><text class="t1_1">{{product.fy_money_val}}</text>元参与奖</view> |
|||
<view class="t1" v-if="product.bzjl_type==2"><text class="t1_1">{{product.bzj_score}}</text>积分</view> |
|||
<view class="t1" v-if="product.bzjl_type==3"><text class="t1_1">{{product.bzj_commission}}</text>元佣金</view> |
|||
<view class="t1" v-if="product.bzjl_type==4"><text class="t1_1"></text>优惠券</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<view class="teamlist" v-if="teamCount > 0"> |
|||
<view class="label"><view class="after" :style="{background:t('color1')}"></view>{{teamCount}}人在拼单,可直接参与</view> |
|||
<scroll-view :scroll-y="true" class="content"> |
|||
<view v-for="(item, index) in teamList" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image :src="item.headimg"></image> |
|||
<image :src="event_rul +'/static/img/static/img/wh.png'" class="img1"></image> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">还差{{item.teamnum - item.num}}人拼成</view> |
|||
<view class="t2">剩余{{item.djs}}</view> |
|||
</view> |
|||
<button class="f3" @tap="buydialogShow" data-btntype="3" :data-teamid="item.id">去参团</button> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<view class="commentbox" v-if="shopset.comment==1 && commentcount > 0"> |
|||
<view class="title"> |
|||
<view class="f1">评价({{commentcount}})</view> |
|||
<view class="f2" @tap="goto" :data-url="'commentlist?proid=' + product.id">好评度 <text :style="{color:t('color1')}">{{product.comment_haopercent}}%</text><image style="width:32rpx;height:32rpx;" :src="event_rul +'/static/img/static/img/arrowright.png'"/></view> |
|||
</view> |
|||
<view class="comment"> |
|||
<view class="item" v-if="commentlist.length>0"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="commentlist[0].headimg"/> |
|||
<view class="t2">{{commentlist[0].nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (commentlist[0].score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{commentlist[0].content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="commentlist[0].content_pic!=''"> |
|||
<block v-for="(itemp, index) in commentlist[0].content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="commentlist[0].content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" @tap="goto" :data-url="'commentlist?proid=' + product.id">查看全部评价</view> |
|||
</view> |
|||
<view v-else class="nocomment">暂无评价~</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="shop" v-if="shopset.showjd==1"> |
|||
<image :src="business.logo" class="p1"/> |
|||
<view class="p2 flex1"> |
|||
<view class="t1">{{business.name}}</view> |
|||
<view class="t2">{{business.desc}}</view> |
|||
</view> |
|||
<button class="p4" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" :data-url="product.bid==0?'/pages/index/index':'/pages/business/index?id='+product.bid" data-opentype="reLaunch">进入店铺</button> |
|||
</view> |
|||
<view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">商品描述</view><view class="t2"></view><view class="t1"></view></view> |
|||
<view class="detail"> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
</view> |
|||
|
|||
|
|||
<view style="width:100%;height:70px;"></view> |
|||
|
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':'notabbarbot'" v-if="product.status==1"> |
|||
<view class="item" @tap="goto" :data-url="'prolist?bid='+product.bid"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/shou.png'"/> |
|||
<view class="t1">首页</view> |
|||
</view> |
|||
<view class="item " @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="item" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
<view class="item" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
<view class="tocart" :style="{background:t('color2')}" @tap="buydialogShow" data-btntype="1"><text>¥{{product.market_price}}</text><text>单独购买</text></view> |
|||
<view class="tobuy" :style="{background:t('color1')}" @tap="buydialogShow" data-btntype="2" v-if="kaituan_status==1 && product.isktdate==1"><text>¥{{product.sell_price}}</text><text>发起拼团</text></view> |
|||
<view class="tobuy flex-x-center flex-y-center" style="background:#ccc" v-else-if="kaituan_status!=1 && product.isktdate==1">发起拼团</view> |
|||
<view v-else class="tobuy" :style="{background:t('color1')}" @tap="buydialogShow" data-btntype="2"><text>¥{{product.sell_price}}</text><text>发起拼团</text></view> |
|||
</view> |
|||
<view :hidden="buydialogHidden"> |
|||
<view class="buydialog-mask"> |
|||
<view class="buydialog" :class="menuindex>-1?'tabbarbot':'notabbarbot'"> |
|||
<view class="close" @tap="buydialogChange"> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="image"></image> |
|||
</view> |
|||
<view class="title"> |
|||
<image :src="guigelist[ks].pic?guigelist[ks].pic:product.pic" class="img" @tap="previewImage" :data-url="guigelist[ks].pic?guigelist[ks].pic:product.pic"></image> |
|||
<!-- <text class="name">{{product.name}}</text> --> |
|||
<view class="price" v-if="btntype==1"><text class="t1">¥</text>{{guigelist[ks].market_price}}</view> |
|||
<view class="price" v-else><text class="t1">¥</text>{{guigelist[ks].sell_price}} <text v-if="guigelist[ks].market_price > guigelist[ks].sell_price" class="t2">¥{{guigelist[ks].market_price}}</text></view> |
|||
<view class="choosename">已选规格: {{guigelist[ks].name}}</view> |
|||
<view class="stock">剩余{{guigelist[ks].stock}}件</view> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in guigedata" :key="index" class="guigelist flex-col"> |
|||
<view class="name">{{item.title}}</view> |
|||
<view class="item flex flex-y-center"> |
|||
<block v-for="(item2, index2) in item.items" :key="index2"> |
|||
<view :data-itemk="item.k" :data-idx="item2.k" :class="'item2 ' + (ggselected[item.k]==item2.k ? 'on':'')" @tap="ggchange">{{item2.title}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="flex1">购买数量:</view> |
|||
<view class="addnum"> |
|||
<view class="minus"><image class="img" :src="event_rul +'/static/img/static/img/cart-minus.png'" @tap="gwcminus"/></view> |
|||
<input class="input" type="number" :value="gwcnum" @input="gwcinput" max="1"></input> |
|||
<view class="plus"><image class="img" :src="event_rul +'/static/img/static/img/cart-plus.png'" @tap="gwcplus"/></view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="btntype==1"> |
|||
<button class="tobuy" :style="{background:t('color2')}" @tap="tobuy" data-type="1">确定</button> |
|||
</block> |
|||
<block v-if="btntype==2"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="2">下一步</button> |
|||
</block> |
|||
<block v-if="btntype==3"> |
|||
<button class="tobuy" :style="{background:t('color1')}" @tap="tobuy" data-type="3">确 定</button> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul +'/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
var app = getApp(); |
|||
var interval2 = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
indexurl:app.globalData.indexurl, |
|||
tabnum: 1, |
|||
buydialogHidden: true, |
|||
num: 1, |
|||
teamCount:0, |
|||
sysset:{}, |
|||
shopset:{}, |
|||
isfavorite: false, |
|||
btntype: 1, |
|||
ggselected: [], |
|||
guigedata:[], |
|||
guigelist:[], |
|||
ks: '', |
|||
gwcnum: 1, |
|||
nodata: 0, |
|||
product:{}, |
|||
userinfo: [], |
|||
current: 0, |
|||
pagecontent: "", |
|||
business:{}, |
|||
commentcount:0, |
|||
commentlist:[], |
|||
nowtime: "", |
|||
teamList: [], |
|||
teamid: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
kfurl:'', |
|||
kaituan_status:0, |
|||
kaituan_duration:0, |
|||
kaituan_starttime:0, |
|||
djshour:'00', |
|||
djsmin:'00', |
|||
djssec:'00', |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var id = that.opt.id; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/product2', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var pagecontent = JSON.parse(res.product.detail); |
|||
that.pagecontent = pagecontent; |
|||
that.business = res.business; |
|||
that.commentcount = res.commentcount; |
|||
that.commentlist = res.commentlist; |
|||
that.ggselected = res.ggselected; |
|||
that.guigedata = res.guigedata; |
|||
that.guigelist = res.guigelist; |
|||
that.isfavorite = res.isfavorite; |
|||
that.ks = res.ks; |
|||
that.nowtime = res.nowtime; |
|||
that.product = res.product; |
|||
that.shopset = res.shopset; |
|||
that.sysset = res.sysset; |
|||
that.teamCount = res.teamCount; |
|||
that.teamList = res.teamList; |
|||
that.nowtime = res.nowtime; |
|||
that.kaituan_duration = res.shopset.duration, |
|||
that.kaituan_starttime = res.begin_time, |
|||
that.kaituan_endtime = res.endtime, |
|||
that.kaituan_status = res.begin_status, |
|||
setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
uni.setNavigationBarTitle({ |
|||
title: res.product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+res.product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.getdjs2(); |
|||
clearInterval(interval2); |
|||
interval2 = setInterval(function(){ |
|||
that.nowtime2 = that.nowtime2+1; |
|||
that.getdjs2(); |
|||
},1000) |
|||
that.loaded({title:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current; |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var nowtime = that.nowtime; |
|||
for (var i in that.teamList) { |
|||
var thisteam = that.teamList[i]; |
|||
var totalsec = thisteam.createtime * 1 + thisteam.teamhour * 3600 - nowtime * 1; |
|||
if (totalsec <= 0) { |
|||
that.teamList[i].djs = '00时00分00秒'; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
} |
|||
that.teamList[i].djs = djs; |
|||
} |
|||
}, |
|||
|
|||
getdjs2:function(){ |
|||
var that = this |
|||
var nowtime = that.nowtime*1; |
|||
var kaituan_starttime = that.kaituan_starttime*1; |
|||
var kaituan_endtime = that.kaituan_endtime; |
|||
if(kaituan_endtime < nowtime){ //已结束 |
|||
that.kaituan_status = 2 |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
}else{ |
|||
if(kaituan_starttime > nowtime){ //未开始 |
|||
that.kaituan_status = 0 |
|||
var totalsec = kaituan_starttime - nowtime; |
|||
}else{ //进行中 |
|||
that.kaituan_status = 1 |
|||
var totalsec = kaituan_endtime - nowtime; |
|||
} |
|||
var houer = Math.floor(totalsec/3600); |
|||
var min = Math.floor((totalsec - houer *3600)/60); |
|||
var sec = totalsec - houer*3600 - min*60 |
|||
var djs = (houer<10?'0':'')+houer+'时'+(min<10?'0':'')+min+'分'+(sec<10?'0':'')+sec+'秒'; |
|||
var djshour = (houer<10?'0':'')+houer |
|||
var djsmin = (min<10?'0':'')+min |
|||
var djssec = (sec<10?'0':'')+sec |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
console.log(that.kaituan_status); |
|||
}, |
|||
//加入购物车 |
|||
buydialogShow: function (e) { |
|||
var btntype = e.currentTarget.dataset.btntype; |
|||
if (btntype == 3) { |
|||
this.teamid = e.currentTarget.dataset.teamid |
|||
} |
|||
this.btntype = btntype; |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
buydialogChange: function (e) { |
|||
this.buydialogHidden = !this.buydialogHidden; |
|||
}, |
|||
//选择规格 |
|||
ggchange: function (e) { |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var itemk = e.currentTarget.dataset.itemk; |
|||
var ggselected = this.ggselected; |
|||
ggselected[itemk] = idx; |
|||
var ks = ggselected.join(','); |
|||
this.ggselected = ggselected; |
|||
this.ks = ks; |
|||
}, |
|||
tobuy: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var ks = that.ks; |
|||
var proid = that.product.id; |
|||
var ggid = that.guigelist[ks].id; |
|||
var num = that.gwcnum; |
|||
var shareid = that.opt.pid; |
|||
app.goto('buy?proid=' + proid + '&ggid=' + ggid + '&num=' + num + '&shareid='+shareid+'&buytype=' + type + (type == 3 ? '&teamid=' + that.teamid : '')); |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var gwcnum = this.gwcnum + 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
this.gwcnum = 1 |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var gwcnum = this.gwcnum - 1; |
|||
var ggselected = this.ks; |
|||
if (gwcnum <= 0) { |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum - 1 |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var ggselected = this.ks; |
|||
var gwcnum = parseInt(e.detail.value); |
|||
return 1; |
|||
|
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
return this.guigelist[ggselected].stock; |
|||
} |
|||
this.gwcnum = 1; |
|||
}, |
|||
//收藏操作 |
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.showLoading('收藏中'); |
|||
app.post('ApiLuckyCollage/addfavorite', {proid: proid,type: 'luckycollage'}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
tabClick: function (e) { |
|||
this.tabnum = e.currentTarget.dataset.num; |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiLuckyCollage/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false;; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/luckycollage/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/luckycollage/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 750rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
.containerbox{ position: relative;} |
|||
|
|||
.header {width: 95%;padding: 0 3%;background: #fff; margin:0 20rpx;border-radius: 0px 0px 16rpx 16rpx;} |
|||
.header .title {padding: 10px 0px;line-height:44rpx;font-size:32rpx;display:flex;} |
|||
.header .title .lef{display:flex;flex-direction:column;justify-content: center;flex:1;color:#222222;font-weight:bold} |
|||
.header .title .lef .t2{ font-size:26rpx;color:#999;padding-top:10rpx;font-weight:normal} |
|||
.header .title .share{width:88rpx;height:88rpx;padding-left:20rpx;border-left:0 solid #f5f5f5;text-align:center;font-size:24rpx;color:#222;display:flex;flex-direction:column;align-items:center} |
|||
.header .title .share image{width:32rpx;height:32rpx;margin-bottom:4rpx} |
|||
|
|||
.header .price{height: 86rpx;overflow: hidden;line-height: 86rpx;border-top: 1px solid #eee;} |
|||
.header .price .t1 .x1{ color: #e94745; font-size: 34rpx;} |
|||
.header .price .t1 .x2{ color: #939393; margin-left: 10rpx; text-decoration: line-through;font-size:24rpx} |
|||
.header .price .t2{color: #aaa; font-size: 24rpx;} |
|||
.header .fuwupoint{width:100%;font-size:24rpx;color:#999;display:flex;flex-wrap:wrap;border-top:1px solid #eee;padding:10rpx 0} |
|||
.header .fuwupoint .t{ padding:4rpx 20rpx 4rpx 0} |
|||
.header .fuwupoint .t:before{content: ""; display: inline-block; vertical-align: middle; margin-top: -4rpx; margin-right: 10rpx; width: 24rpx; height: 24rpx; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURUdwTOU5O+Q5POU5POQ4O+U4PN80P+M4O+Q4O+Q4POQ5POQ4OuQ4O+Q4O+I4PuQ5PJxkAycAAAAPdFJOUwAf+VSoeAvzws7ka7miLboUzckAAADJSURBVBjTY2BgYGCMWVR5VIABDBid/gPBFwjP/JOzQKKtfjGIzf3fEUSJ/N8AJO21Iao3fQbqqA+AcLi/CzCwfGGAAn8HBnlFMIttBoP4R4b4C2BOzk8G3q8M5w3AnPsLGZj/MKwHW8b6/QED4y8G/QQQx14ZSHwCcWYkMOtvAHOAyvqnPf8KcuMvkAGZP9eDjAQaEO/AwDb/D0gj0GiQpRnTQIYIfUR1DopDGexVIZygz8ieC4B6WyzRBOJtBkZ/pAABBZUWOKgAispF5e7ibycAAAAASUVORK5CYII=') no-repeat; background-size: 24rpx auto; } |
|||
.choose{ display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; height: 80rpx; line-height: 80rpx; padding: 0 3%; color: #505050; } |
|||
.choose .f2{ width: 40rpx; height: 40rpx;} |
|||
|
|||
.teamlist{ width:95%;margin:0 20rpx;border-radius: 16rpx; background:#fff;padding:10rpx 20rpx;font-size:26rpx;margin-top:20rpx;display:flex;flex-direction:column} |
|||
.teamlist .label{ padding-left: 30rpx; height: 100rpx; position: relative; width:100%;color:#222222;font-weight:bold; line-height: 80rpx;} |
|||
.teamlist .label .after{display:block;position:absolute;border-right:10rpx solid red;top:20rpx;left:10rpx;height:36rpx; border-radius:1.5px;} |
|||
.teamlist .content{ width:100%;max-height:300rpx;overflow:scroll} |
|||
.teamlist .item{width:100%;display:flex;align-items:center;padding:12rpx 3px;border-bottom:0px solid #f5f5f5} |
|||
.teamlist .item .f1{overflow:hidden;display:flex;align-items:center} |
|||
.teamlist .item .f1 image{width:80rpx;height:80rpx; border-radius: 50%;} |
|||
.teamlist .item .f1 .img1{ position: absolute;left:10%; background: #D9D9D9; } |
|||
.teamlist .item .f1 .t1{padding-left:6rpx;font-size:30rpx;color:#333} |
|||
.teamlist .item .f2{ margin:0 8rpx; width: 160px; margin-left: 50px;} |
|||
.teamlist .item .f2 .t1{font-size:24rpx;color:#333} |
|||
.teamlist .item .f2 .t2{font-size:22rpx;color:#999} |
|||
.teamlist .item .f3{ background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);color:#fff;border-radius:26rpx;padding:0 20rpx;height:50rpx;border:0;text-align:right;font-size:26rpx;display:flex;align-items:center} |
|||
.teamlist .item .f3:after{border:0} |
|||
|
|||
|
|||
.shop{width:95%;margin:0 20rpx;display:flex;align-items:center; border-radius: 16rpx; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 136rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:50%;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:60rpx;margin-bottom:30rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.commentbox{width:100%;background:#fff;padding:0 3%;margin-top:20rpx} |
|||
.commentbox .title{height:90rpx;line-height:90rpx;border-bottom:1px solid #DDDDDD;display:flex} |
|||
.commentbox .title .f1{flex:1;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.commentbox .title .f2{color:#333;font-weight:bold;font-size:28rpx;display:flex;align-items:center} |
|||
.commentbox .nocomment{height:100rpx;line-height:100rpx} |
|||
|
|||
.comment{display:flex;flex-direction:column;min-height:200rpx;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{margin:20rpx auto;padding:0 30rpx;height:60rpx;line-height:60rpx;border:1px solid #E6E6E6;border-radius:30rpx;color:#111111;font-weight:bold;font-size:26rpx} |
|||
|
|||
.bottombar{ padding:10rpx;width: 100%; position: fixed;bottom: 0px; left: 0px; background: #fff; height: 120rpx;} |
|||
.bottombar .favorite{width: 15%;color:#707070;font-size:26rpx} |
|||
.bottombar .favorite .fa{ font-size:40rpx;height:50rpx;line-height:50rpx} |
|||
.bottombar .favorite .img{ width:50rpx;height:50rpx} |
|||
.bottombar .favorite .t1{font-size:24rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .cart{width: 15%;font-size:26rpx;color:#707070} |
|||
.bottombar .cart .img{ width:50rpx;height:50rpx} |
|||
.bottombar .cart .t1{font-size:24rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .tocart{ width: 30%; height: 100rpx;color: #fff; border-radius: 88rpx 0px 0px 88rpx;background: #fa938a; font-size: 28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.bottombar .tobuy{ width:30%; height: 100rpx;color: #fff; border-radius: 0px 88rpx 88rpx 0px;background: #df2e24; font-size:28rpx;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.bottombar .item{width: 15%;font-size:24rpx;color:#222222; text-align: center; margin-top:12rpx } |
|||
.bottombar .item .img{ width:50rpx;height:50rpx} |
|||
|
|||
.buydialog-mask{ position: fixed; top: 0px; left: 0px; width: 100%; background: rgba(0,0,0,0.5); bottom: 0px;z-index:10} |
|||
.buydialog{ position: fixed; width: 100%; left: 0px; bottom: 0px; background: #fff;z-index:11;border-radius:20rpx 20rpx 0px 0px} |
|||
.buydialog .close{ position: absolute; top: 0; right: 0;padding:20rpx;z-index:12} |
|||
.buydialog .close .image{ width: 30rpx; height:30rpx; } |
|||
.buydialog .title{ width: 94%;position: relative; margin: 0 3%; padding:20rpx 0px; border-bottom:0; height: 190rpx;} |
|||
.buydialog .title .img{ width: 160rpx; height: 160rpx; position: absolute; top: 20rpx; border-radius: 10rpx; border: 0 #e5e5e5 solid;background-color: #fff} |
|||
.buydialog .title .price{ padding-left:180rpx;width:100%;font-size: 36rpx;height:70rpx; color: #FC4343;overflow: hidden;} |
|||
.buydialog .title .price .t1{ font-size:26rpx} |
|||
.buydialog .title .price .t2{ font-size:26rpx;text-decoration:line-through;color:#aaa} |
|||
.buydialog .title .choosename{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
.buydialog .title .stock{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 42rpx;line-height:42rpx;color:#888888} |
|||
|
|||
.buydialog .guigelist{ width: 94%; position: relative; margin: 0 3%; padding:0px 0px 10px 0px; border-bottom: 0; } |
|||
.buydialog .guigelist .name{ height:70rpx; line-height: 70rpx;} |
|||
.buydialog .guigelist .item{ font-size: 30rpx;color: #333;flex-wrap:wrap} |
|||
.buydialog .guigelist .item2{ height:60rpx;line-height:60rpx;margin-bottom:4px;border:0; border-radius:4rpx; padding:0 40rpx;color:#666666; margin-right: 10rpx; font-size:26rpx;background:#F4F4F4} |
|||
.buydialog .guigelist .on{color:#FC4343;background:rgba(252,67,67,0.1);font-weight:bold} |
|||
.buydialog .buynum{ width: 94%; position: relative; margin: 0 3%; padding:10px 0px 10px 0px; } |
|||
.buydialog .addnum {font-size: 30rpx;color: #666;width:auto;display:flex;align-items:center} |
|||
.buydialog .addnum .plus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .minus {width:48rpx;height:36rpx;background:#F6F8F7;display:flex;align-items:center;justify-content:center} |
|||
.buydialog .addnum .img{width:24rpx;height:24rpx} |
|||
.buydialog .addnum .input{flex:1;width:70rpx;border:0;text-align:center;color:#2B2B2B;font-size:24rpx} |
|||
.buydialog .op{width:90%;margin:20rpx 5%;border-radius:36rpx;overflow:hidden;display:flex;margin-top:100rpx;} |
|||
.buydialog .addcart{flex:1;height:72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none; font-size:28rpx;font-weight:bold} |
|||
.buydialog .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;} |
|||
.buydialog .nostock{flex:1;height: 72rpx; line-height: 72rpx; background:#aaa; color: #fff; border-radius: 0px; border: none;} |
|||
|
|||
.collage_title{width:95%;height:110rpx; position: absolute; bottom: 0; background-image: url('https://v2d.diandashop.com/static/img/xypt_bg.png'); background-size: 100%; display:flex;align-items:center;padding:0 40rpx; margin:0 20rpx;} |
|||
.collage_title .f1{flex:1;display:flex;flex-direction:column;} |
|||
.collage_title .f1 .t1{display:flex;align-items:center;height:60rpx;line-height:60rpx; margin-top: 20rpx;} |
|||
.collage_title .f1 .t1 .x1{font-size:28rpx;color:#fff} |
|||
.collage_title .f1 .t1 .x2{font-size:48rpx;color:#fff;padding-right:20rpx} |
|||
.collage_title .f1 .t1 .x3{margin-left: 60rpx;font-size:24rpx;font-weight:bold;height:40rpx;line-height:40rpx;padding:0 20rpx;border-radius:20rpx;background:#fff;color:#ED533A} |
|||
.collage_title .f1 .t2{color:rgba(255,255,255,0.6);font-size:20rpx;text-decoration: line-through;margin-top: 10rpx;} |
|||
.collage_title .f2{color:#fff;font-size:28rpx;} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
|
|||
.title2{ align-items: center; padding-bottom: 20rpx;} |
|||
.title2 .p1{ font-size: 20rpx;border-bottom-right-radius:40rpx; margin: auto; width: 30%;padding:30rpx 0; text-align: center; border: 1rpx solid #FF3143; border: 1px solid rgba(255, 49, 67, 0.2); margin-right: 10rpx;} |
|||
.title2 .t1{ line-height: 40rpx;} |
|||
.title2 .t1 .t1_1{ color:#FF3143} |
|||
.title2 image{ width: 80rpx; height: 80rpx;} |
|||
</style> |
|||
@ -0,0 +1,192 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<image class="img" :src="event_rul + '/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="输入商品名称" placeholder-style="font-size:24rpx;color:#C2C2C2" @confirm="searchConfirm" @input="searchChange"></input> |
|||
</view> |
|||
</view> |
|||
<view class="datalist flex" > |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view :data-url="linktype+'?id=' + item.id" @tap="goto" class="collage-product"> |
|||
<view class="product-pic"> |
|||
<image :src="item.pic" mode="widthFix"></image> |
|||
<view class="desc"> |
|||
<text v-if="item.gua_num>0">{{item.teamnum}}人拼团 {{item.gua_num}}人得商品</text> |
|||
<text v-else style="line-height: 80rpx;">{{item.teamnum}}人拼团 {{item.gua_num}}人得商品</text> |
|||
<view v-if="item.linktype==1"> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==1">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.money}}元参与奖</text> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==2">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.bzj_score}}积分</text> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==3">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.bzj_commission}}元佣金</text> |
|||
<text v-if="item.teamnum-item.gua_num>0 && item.bzjl_type==4">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.money}}优惠券</text> |
|||
</view> |
|||
<view v-else> |
|||
<text v-if="item.teamnum-item.gua_num>0">{{item.teamnum-item.gua_num}}人{{item.teamnum-item.gua_num>1?'各':''}}得{{item.money}}元参与奖</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="p1">{{item.name}}</view> |
|||
<view class="p2"> |
|||
<view class="p2-1"> |
|||
<text class="t1" :style="{color:t('color1')}"><text style="font-size:24rpx">¥</text>{{item.sell_price}}</text> |
|||
<text class="t2" v-if="item.market_price*1 > item.sell_price*1">¥{{item.market_price}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="p3"> |
|||
<view class="t1"><text class="team_text">{{item.teamnum}}人拼</text> 已拼成<text style="font-size:32rpx;color:#f40;padding:0 2rpx;">{{item.sales}}</text>件</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<button class="covermy" @tap="goto" data-url="orderlist">我的拼团</button> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
keyword: '', |
|||
bid:'', |
|||
pics: [], |
|||
pagenum: 1, |
|||
st: '', |
|||
datalist: [], |
|||
nomore: false, |
|||
nodata:false, |
|||
linktype:'product', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.bid = this.opt.bid || ''; |
|||
this.cid = this.opt.cid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
var that = this; |
|||
app.get('ApiIndex/getCustom',{}, function (customs) { |
|||
if(customs.data.includes('plug_luckycollage')) { |
|||
that.linktype = 'product2'; |
|||
} |
|||
}); |
|||
|
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
var keyword = that.keyword; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiLuckyCollage/prolist', {cid:that.cid,bid:that.bid,keyword: keyword,st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.pics = res.pics; |
|||
that.clist = res.clist; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
|
|||
changetab: function (e) { |
|||
var st = e.currentTarget.dataset.st; |
|||
this.pagenum = 1; |
|||
this.st = st; |
|||
this.datalist = []; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword; |
|||
that.getdata(); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.container{background:#f4f4f4} |
|||
|
|||
.topsearch{width:94%;margin:16rpx 3%;} |
|||
.topsearch .f1{height:60rpx;border-radius:30rpx;border:0;background-color:#fff;flex:1} |
|||
.topsearch .f1 .img{width:24rpx;height:24rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
|
|||
.swiper {width:94%;margin:0 3%;height: 350rpx;margin-top: 20rpx;border-radius:20rpx;overflow:hidden} |
|||
.swiper image {width: 100%;overflow: hidden;} |
|||
|
|||
.category{width:94%;margin:0 3%;padding-top: 10px;padding-bottom: 10px;flex-direction:row;white-space: nowrap; display:flex;} |
|||
.category .item{width: 150rpx;display: inline-block; text-align: center;} |
|||
.category .item image{width: 80rpx;height: 80rpx;margin: 0 auto;border-radius: 50%;} |
|||
.category .item .t1{display: block;color: #666;} |
|||
|
|||
.datalist{width:96%;margin:0 3%; flex-wrap: wrap;} |
|||
.collage-product { background: #fff; width: 47%;margin-right:20rpx;padding:20rpx 20rpx;margin-top: 20rpx;border-radius:20rpx} |
|||
.collage-product .product-pic { background: #ffffff;overflow:hidden; position: relative;} |
|||
.collage-product .product-pic .desc{ display: flex; width: 100%; flex-wrap: wrap; position: absolute; bottom: 0; background: #FF3143; opacity: 0.7; color:#fff;font-size: 20rpx;height:80rpx; padding:5rpx 10rpx} |
|||
.collage-product .product-pic image{width: 100%;height:180rpx;} |
|||
.collage-product .product-info {padding: 5rpx 10rpx;flex:1} |
|||
.collage-product .product-info .p1 {color:#222;font-weight:bold;font-size:28rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:72rpx} |
|||
.collage-product .product-info .p2{font-size: 32rpx;height:40rpx;line-height: 40rpx; margin-bottom: 10rpx; } |
|||
.collage-product .product-info .p2 .t1{color: #FF3143;font-size: 36rpx;font-weight: bold; } |
|||
.collage-product .product-info .p2 .t2 {margin-left: 10rpx;font-size: 26rpx;color: #888;text-decoration: line-through;} |
|||
.collage-product .product-info .p3{font-size: 24rpx;height:50rpx;line-height:50rpx;overflow:hidden;display:flex;} |
|||
.collage-product .product-info .p3 .t1{color:#aaa;font-size:24rpx;flex:1;} |
|||
.collage-product .product-info .p3 .t2{height: 50rpx;line-height: 50rpx;overflow: hidden;border: 1px #FF3143 solid;border-radius:10rpx;} |
|||
.collage-product .product-info .p3 .t2 .x1{padding: 10rpx 24rpx;} |
|||
.collage-product .product-info .p3 .t2 .x2{padding: 14rpx 24rpx;background: #FF3143;color:#fff;} |
|||
.collage-product .product-info .p3 .team_text{ padding:0rpx 10rpx; margin-right:10rpx;border-radius: 4rpx; color: #FF3143; background:#FFDED9 ; font-size: 20rpx; display: inline-block;} |
|||
.covermy{position:absolute;z-index:99999;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;z-index:9999;top:260rpx;right:0;color:#fff;background-color:rgba(17,17,17,0.3);width:140rpx;height:60rpx;font-size:26rpx;border-radius:30rpx 0px 0px 30rpx;} |
|||
</style> |
|||
@ -0,0 +1,100 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<form @submit="formSubmit" @reset="formReset" report-submit="true"> |
|||
<view class="form-item"> |
|||
<text class="label">退款原因</text> |
|||
<view class="input-item"><textarea placeholder="请输入退款原因" placeholder-style="color:#999;" name="reason"></textarea></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退款金额(元)</text> |
|||
<view class="flex"><input name="money" type="digit" :value="totalprice" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<button class="ref-btn" form-type="submit">确定</button> |
|||
</form> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderid: '', |
|||
totalprice: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
|
|||
var that = this; |
|||
that.orderid = that.opt.orderid; |
|||
that.totalprice = that.opt.price; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.loaded(); |
|||
}, |
|||
formSubmit: function (e) { |
|||
//console.log(e);return; |
|||
var that = this; |
|||
var orderid = that.orderid; |
|||
var reason = e.detail.value.reason; |
|||
var money = parseFloat(e.detail.value.money); |
|||
|
|||
if (reason == '') { |
|||
app.alert('请填写退款原因'); |
|||
return; |
|||
} |
|||
|
|||
if (money <= 0 || money > parseFloat(that.totalprice)) { |
|||
app.alert('退款金额有误'); |
|||
return; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiLuckyCollage/refund', { |
|||
orderid: orderid, |
|||
reason: reason, |
|||
money: money |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
app.alert(data.msg); |
|||
var pages = getCurrentPages(); |
|||
|
|||
if (pages.length > 1) { |
|||
var prePage = pages[pages.length - 2]; |
|||
prePage.onLoad(); |
|||
} |
|||
|
|||
setTimeout(function () { |
|||
app.goback(); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item{ width:100%;background: #fff; padding: 32rpx 20rpx;} |
|||
.form-item .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item .input-item{ width:100%;} |
|||
.form-item textarea{ width:100%;height:200rpx;border: 1px #eee solid;padding: 20rpx;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx} |
|||
.form-item .mid{ height:80rpx;line-height:80rpx;padding:0 20rpx;} |
|||
.ref-btn{ width: 90%; margin: 0 5%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 8px;border: none; background: #ff8758; } |
|||
</style> |
|||
@ -0,0 +1,443 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="container"> |
|||
<view class="topbg"> |
|||
<image :src="pre_url + '/static/img/collage_teambg.png'" class="image"/> |
|||
</view> |
|||
<view class="topbox" @tap="goto" :data-url="'product?id=' + product.id"> |
|||
<view class="left"> |
|||
<image :src="product.pic"></image> |
|||
</view> |
|||
<view class="right"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2"><view class="t1">{{product.teamnum}}人团</view></view> |
|||
<view class="f3"> |
|||
<view class="t1">¥</view> |
|||
<view class="t2">{{product.sell_price}}</view> |
|||
<view class="t3">{{product.sales}}人已拼</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="title2 flex"> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_1.png'"></image><view class="t1">参与拼团</view><view class="t1"><text class="t1_1">{{product.teamnum}}</text>人成团</view></view> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_2.png'"></image><view class="t1"><text class="t1_1">{{product.gua_num}}</text>人拼中发货</view><view class="t1"><text class="t1_1">{{product.teamnum-product.gua_num}}</text>人未中退款</view></view> |
|||
<view class="p1"><image :src="event_rul +'/static/img/static/img/pintuan_3.png'"></image> |
|||
<view class="t1">未中补贴</view> |
|||
<view v-if="product.linktype==1"> |
|||
<view class="t1" v-if="product.bzjl_type==1"><text class="t1_1">{{product.fy_money_val}}</text>元参与奖</view> |
|||
<view class="t1" v-if="product.bzjl_type==2"><text class="t1_1">{{product.bzj_score}}</text>积分</view> |
|||
<view class="t1" v-if="product.bzjl_type==3"><text class="t1_1">{{product.bzj_commission}}</text>元佣金</view> |
|||
<view class="t1" v-if="product.bzjl_type==4"><text class="t1_1"></text>优惠券</view> |
|||
</view> |
|||
<view v-else> |
|||
<view class="t1">未中补贴</view><view class="t1"><text class="t1_1">{{product.fy_money_val}}</text>元参与奖</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="teambox"> |
|||
<view class="userlist"> |
|||
<view v-for="(item, index) in userlist" :key="index" class="item"> |
|||
<image :src="item.headimg?item.headimg:event_rul +'/static/img/static/img/wh.png'" class="f1"></image> |
|||
<text class="f2" v-if="item.id == team.mid">团长</text> |
|||
<view v-if="team.status==2 && item.iszj==1">已中奖</view> |
|||
<view v-if="team.status==2 && item.iszj==0">未中奖</view> |
|||
</view> |
|||
</view> |
|||
<view class="join-text" v-if="team.status==1"> |
|||
<view>仅剩<text class="join-te1">{{team.teamnum-team.num}}</text>个名额</view> |
|||
<view style="font-size:28rpx;color:#f80"> {{rtimeformat}} 后结束</view> |
|||
</view> |
|||
<view class="join-text" v-if="team.status==2"> |
|||
|
|||
|
|||
|
|||
已满员,拼团成功</view> |
|||
<view class="join-text" v-if="team.status==3">拼团失败</view> |
|||
<button class="join-btn" @tap="shareClick" v-if="team.status==1 && haveme==1">邀请好友参团</button> |
|||
<button class="join-btn" @tap="buydialogChange" v-if="team.status==1 && haveme==0">我要参团</button> |
|||
</view> |
|||
<view :hidden="buydialogHidden"> |
|||
<view class="buydialog-mask"> |
|||
<view class="buydialog"> |
|||
<view class="close" @tap="buydialogChange"> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="buydialog-canimg"></image> |
|||
</view> |
|||
<view class="title"> |
|||
<image :src="guigelist[ks].pic?guigelist[ks].pic:product.pic" class="img" @tap="previewImage" :data-url="guigelist[ks].pic?guigelist[ks].pic:product.pic"></image> |
|||
<view class="price"><text class="t1">¥</text>{{guigelist[ks].sell_price}} <text v-if="guigelist[ks].market_price > guigelist[ks].sell_price" class="t2">¥{{guigelist[ks].market_price}}</text></view> |
|||
<view class="choosename">已选规格: {{guigelist[ks].name}}</view> |
|||
<view class="stock">剩余{{guigelist[ks].stock}}件</view> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in guigedata" :key="index" class="guigelist flex-col"> |
|||
<view class="name">{{item.title}}</view> |
|||
<view class="item flex flex-y-center"> |
|||
<block v-for="(item2, index2) in item.items" :key="index2"> |
|||
<view :data-itemk="item.k" :data-idx="item2.k" :class="'item2 ' + (ggselected[item.k]==item2.k ? 'on':'')" @tap="ggchange">{{item2.title}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="flex1">购买数量:</view> |
|||
<view class="f2 flex flex-y-center"> |
|||
<text class="minus flex-x-center" @tap="gwcminus">-</text> |
|||
<input class="flex-x-center" type="number" :value="gwcnum" @input="gwcinput"></input> |
|||
<text class="plus flex-x-center" @tap="gwcplus">+</text> |
|||
</view> |
|||
</view> |
|||
<block> |
|||
<button class="tobuy" @tap="tobuy" data-type="3">确 定</button> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul +'/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
tabnum: 1, |
|||
ggselected: [], |
|||
guigedata: [], |
|||
guigelist:[], |
|||
haveme:0, |
|||
ks: '', |
|||
gwcnum: 1, |
|||
showdetail: false, |
|||
buydialogHidden: true, |
|||
team: [], |
|||
userlist: [], |
|||
product: [], |
|||
rtime: '', |
|||
rtimeformat: '', |
|||
isfavorite: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
clearInterval(interval); |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:'就差你了,快来一起拼团~ ' + this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:'就差你了,快来一起拼团~ ' + this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var teamid = that.opt.teamid; |
|||
that.loading = true; |
|||
app.get('ApiLuckyCollage/team', {teamid: teamid}, function (res) { |
|||
that.loading = false; |
|||
|
|||
that.ggselected = res.ggselected; |
|||
that.guigedata = res.guigedata; |
|||
that.guigelist = res.guigelist; |
|||
that.haveme = res.haveme; |
|||
that.ks = res.ks; |
|||
that.product = res.product; |
|||
that.rtime = res.rtime; |
|||
that.shopset = res.shopset; |
|||
that.sysset = res.sysset; |
|||
that.team = res.team; |
|||
that.userlist = res.userlist; |
|||
that.getrtime(); |
|||
interval = setInterval(function () { |
|||
that.getrtime(); |
|||
}, 1000); |
|||
that.loaded({title:'就差你了,快来一起拼团~ ',desc:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
buydialogChange: function (e) { |
|||
this.buydialogHidden = !this.buydialogHidden |
|||
}, |
|||
//选择规格 |
|||
ggchange: function (e) { |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var itemk = e.currentTarget.dataset.itemk; |
|||
var ggselected = this.ggselected; |
|||
ggselected[itemk] = idx; |
|||
var ks = ggselected.join(','); |
|||
this.ggselected = ggselected; |
|||
this.ks = ks; |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var gwcnum = this.gwcnum + 1; |
|||
var ggselected = this.ks; |
|||
|
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum + 1; |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var gwcnum = this.gwcnum - 1; |
|||
var ggselected = this.ks; |
|||
|
|||
if (gwcnum <= 0) { |
|||
return; |
|||
} |
|||
this.gwcnum = this.gwcnum - 1; |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var ggselected = this.ks; |
|||
var gwcnum = parseInt(e.detail.value); |
|||
if (gwcnum < 1) return 1; |
|||
if (gwcnum > this.guigelist[ggselected].stock) { |
|||
return this.guigelist[ggselected].stock; |
|||
} |
|||
this.gwcnum = gwcnum; |
|||
}, |
|||
tobuy: function (e) { |
|||
var type = e.currentTarget.dataset.type; |
|||
var that = this; |
|||
var ggselected = that.ks; |
|||
var proid = that.product.id; |
|||
var ggid = that.guigelist[ggselected].id; |
|||
var num = that.gwcnum; //var prodata = proid + ',' + ggid + ',' + num; |
|||
var shareid = that.opt.pid; |
|||
app.goto('buy?proid=' + proid + '&shareid='+shareid+ '&num=' + num + '&ggid=' + ggid + '&buytype=' + type + '&teamid=' + that.team.id); |
|||
}, |
|||
getrtime: function () { |
|||
var rtime = this.rtime - 1; |
|||
if (rtime < 0) { |
|||
this.rtimeformat = '0秒'; |
|||
this.rtime = rtime; |
|||
} else { |
|||
var hours = Math.floor(rtime / 3600); //计算相差分钟数 |
|||
var leave2 = rtime % 3600; //计算小时数后剩余的毫秒数 |
|||
var minutes = Math.floor(leave2 / 60); //计算相差秒数 |
|||
var seconds = leave2 % 60; //计算分钟数后剩余的毫秒数 |
|||
var rtimeformat = hours + "小时" + minutes + "分" + seconds + "秒"; |
|||
this.rtimeformat = rtimeformat; |
|||
this.rtime = rtime; |
|||
} |
|||
}, |
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false; |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('努力生成中'); |
|||
app.post('ApiLuckyCollage/getTeamPoster', {proid: that.product.id,teamid: that.team.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/collage/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/collage/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.topbg{width:100%;height:248rpx;position:relative;z-index:0} |
|||
.topbg .image{width:100%;height:100%} |
|||
.topbox{width:94%;margin:0 3%;margin-top:-140rpx;background:#fff;border-radius:16rpx;padding:24rpx;display:flex;position:relative;z-index:1} |
|||
.topbox .left{flex-shrink:0;width:240rpx;height:240rpx;} |
|||
.topbox .left image{width:100%;height:100%} |
|||
.topbox .right{flex:1;padding-left:20rpx;padding-right:20rpx;display:flex;flex-direction:column} |
|||
.topbox .right .f1{color:#32201B;height:80rpx;line-height:40rpx;font-size:30rpx;font-weight:bold;overflow:hidden} |
|||
.topbox .right .f2{display:flex;margin-top:10rpx} |
|||
.topbox .right .f2 .t1{display:flex;background:rgba(255, 49, 67,0.2);border-radius:20rpx;padding:0 20rpx;height:40rpx;line-height:40rpx;color:#FF3143;font-size:24rpx;} |
|||
.topbox .right .f3{display:flex;align-items:center;color:#FF3143;margin-top:40rpx} |
|||
.topbox .right .f3 .t1{font-size:28rpx} |
|||
.topbox .right .f3 .t2{font-size:40rpx;font-weight:bold;flex:1} |
|||
.topbox .right .f3 .t3{font-size:26rpx;font-weight:bold;} |
|||
|
|||
.teambox{width:94%;margin:0 3%;margin-top:20rpx;background:#fff;border-radius:16rpx;padding:24rpx;display:flex;flex-direction:column} |
|||
|
|||
.userlist{width: 100%;background: #fff;text-align: center;padding-top:40rpx;margin-top:20rpx;} |
|||
.userlist .item{display: inline-block;width:120rpx; height:120rpx;position: relative;} |
|||
.userlist .item .f1{width:100rpx; height:100rpx;border-radius: 50%;border: 1px #ffc32a solid;} |
|||
.userlist .item .f2{background: #ffab33;border-radius:100rpx;padding:4rpx 16rpx;border:1px #fff solid;position: absolute;top: 0px; left: -20rpx;color: #9f7200;font-size: 30rpx;} |
|||
|
|||
.join-text{color:#000;padding: 30rpx 0;font-size:36rpx;font-weight: 600;background: #fff; text-align: center;width: 100%;} |
|||
|
|||
.join-btn{width: 90%;margin:20rpx 5%;background: linear-gradient(90deg, #FF3143 0%, #FE6748 100%);color: #fff;font-size: 30rpx;height:80rpx;border-radius:40rpx} |
|||
|
|||
.buydialog-mask{ position: fixed; top: 0px; left: 0px; width: 100%; background: rgba(0,0,0,0.5); bottom: 0px;z-index:9} |
|||
.buydialog{ position: absolute; width: 100%; left: 0px; bottom: 0px; background: #fff;z-index:9} |
|||
.buydialog .close{ position: absolute; top: 0; right: 0;padding:20rpx;z-index:9999} |
|||
.buydialog .close image{ width: 30rpx; height:30rpx; } |
|||
.buydialog .title{ width: 94%;position: relative; margin: 0 3%; padding:20rpx 0px; border-bottom: 1px #e5e5e5 solid; height: 140rpx;} |
|||
.buydialog .title .img{ width: 160rpx; height: 160rpx; position: absolute; top: -40rpx; border-radius: 10rpx; border: 1px #e5e5e5 solid;background-color: #fff} |
|||
.buydialog .title .price{ padding-left:180rpx;width:100%;font-size: 36rpx;height:50rpx; color: #ff4a03;overflow: hidden;} |
|||
.buydialog .title .price .t1{ font-size:24rpx} |
|||
.buydialog .title .price .t2{ font-size:26rpx;text-decoration:line-through;color:#aaa} |
|||
.buydialog .title .choosename{ padding-left:180rpx;width: 100%;font-size: 24rpx;height: 30rpx;line-height:30rpx;} |
|||
.buydialog .title .stock{ padding-left:180rpx;width: 100%;font-size: 22rpx;height: 30rpx;line-height:30rpx;color:#aaa} |
|||
|
|||
.buydialog .guigelist{ width: 94%; position: relative; margin: 0 3%; padding:0px 0px 10px 0px; border-bottom: 1px #e5e5e5 solid; } |
|||
.buydialog .guigelist .name{ height:70rpx; line-height: 70rpx;} |
|||
.buydialog .guigelist .item{ font-size: 30rpx;color: #333;} |
|||
.buydialog .guigelist .item2{ height:50rpx;line-height:50rpx;border: 1px #a9a9a9 solid; border-radius:8rpx; padding:0 10rpx; color: #353535; margin-right: 10rpx; font-size:26rpx;} |
|||
.buydialog .guigelist .on{ border: 1px #ff4a03 solid;color: #ff4a03;} |
|||
.buydialog .buynum{ width: 94%; position: relative; margin: 0 3%; padding:10px 0px 10px 0px; } |
|||
.buydialog .buynum .f2{ border:1px solid #aaa} |
|||
.buydialog .buynum .f2 input{flex:1;width:70rpx;border-left:1px solid #aaa;border-right:1px solid #aaa;text-align:center} |
|||
.buydialog .buynum .f2 .plus{width:50rpx;} |
|||
.buydialog .buynum .f2 .minus{width:50rpx;} |
|||
.buydialog .addcart{height: 45px; line-height: 45px; background: #e94745; color: #fff; border-radius: 0px; border: none; font-size:16px; } |
|||
.buydialog .tobuy{ height: 45px; line-height: 45px; background: #ff6801; color: #fff; border-radius: 0px; border: none; font-size:16px; } |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
|
|||
.title2{ background: #fff; padding:20rpx;align-items: center; margin: 20rpx;border-radius: 10rpx;} |
|||
.title2 .p1{ font-size: 20rpx;border-bottom-right-radius:40rpx; margin: auto; width: 30%;padding:30rpx 0; text-align: center; border: 1rpx solid #FF3143; border: 1px solid rgba(255, 49, 67, 0.2); margin-right: 10rpx;} |
|||
.title2 .t1{ line-height: 40rpx;} |
|||
.title2 .t1 .t1_1{ color:#FF3143} |
|||
.title2 image{ width: 80rpx; height: 80rpx;} |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,253 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<form @submit="formsubmit"> |
|||
<view class="st_box"> |
|||
<view class="st_title flex-y-center"> |
|||
<view @tap="goback" style="width:100rpx"><image :src="event_rul +'/static/img/static/img/goback.jpg'"></image></view> |
|||
<view style="margin-right:40%">我要发帖</view> |
|||
|
|||
</view> |
|||
<view class="st_form"> |
|||
<view v-if="cateArr"> |
|||
<picker @change="cateChange" :value="cindex" :range="cateArr" style="height:80rpx;line-height:80rpx;border-bottom:1px solid #EEEEEE;font-size:18px"> |
|||
<view class="picker">{{cindex==-1? '请选择发帖类型' : cateArr[cindex]}}</view> |
|||
</picker> |
|||
</view> |
|||
<!-- <view v-if="cateArr"> |
|||
<picker @change="cateChange" :value="cindex" :range="cateArr" style="height:80rpx;line-height:80rpx;border-bottom:1px solid #EEEEEE;font-size:18px"> |
|||
<view class="picker">{{cindex==-1? '请选择曝光标签' : cateArr[cindex]}}</view> |
|||
</picker> |
|||
</view> --> |
|||
<view><textarea placeholder="输入内容" name="content" maxlength="-1"></textarea></view> |
|||
|
|||
<view class="uploadbtn_ziti1"> |
|||
插入图片 |
|||
</view> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx;"> |
|||
<view v-for="(item, index) in pics" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="pics"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" @tap="xuanzhuan" :data-index="index" data-field="pics"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="pics" v-if="pics.length<9"> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<input type="text" hidden="true" name="pics" :value="pics.join(',')" maxlength="-1"></input> |
|||
|
|||
<view class="uploadbtn_ziti2"> |
|||
插入视频 |
|||
</view> |
|||
<view class="flex-y-center" style="width:100%;padding:20rpx 0;margin-top:20rpx;"> |
|||
<image :src="event_rul +'/static/img/static/img/uploadvideo.png'" style="width:200rpx;height:200rpx;background:#eee;" @tap="uploadvideo"></image><text v-if="video" style="padding-left:20rpx;color:#333">已上传短视频</text></view> |
|||
<input type="text" hidden="true" name="video" :value="video" maxlength="-1"></input> |
|||
</view> |
|||
</view> |
|||
<view class="st_title flex-y-center"> |
|||
<button form-type="submit">发表</button> |
|||
</view> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
datalist: [], |
|||
content_pic: [], |
|||
pagenum: 1, |
|||
cateArr: [], |
|||
cindex: -1, |
|||
pics:[], |
|||
video: '', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiLuntan/fatie', {}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.clist = res.clist; |
|||
var clist = res.clist; |
|||
if (clist.length > 0) { |
|||
var cateArr = []; |
|||
for (var i in clist) { |
|||
if (that.opt && that.opt.cid == clist[i].id) { |
|||
that.cindex = i; |
|||
} |
|||
cateArr.push(clist[i].name); |
|||
} |
|||
} else { |
|||
cateArr = false; |
|||
} |
|||
that.cateArr = cateArr |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
cateChange: function (e) { |
|||
this.cindex = e.detail.value; |
|||
}, |
|||
formsubmit: function (e) { |
|||
var that = this; |
|||
console.log(e); |
|||
var clist = that.clist; |
|||
if (clist.length > 0) { |
|||
if (that.cindex == -1) { |
|||
app.error('请选择分类'); |
|||
return false; |
|||
} |
|||
var cid = clist[that.cindex].id; |
|||
} else { |
|||
var cid = 0; |
|||
} |
|||
var formdata = e.detail.value; |
|||
var content = formdata.content; |
|||
var pics = formdata.pics; |
|||
var video = formdata.video; |
|||
if (content == '' && pics == '') { |
|||
app.error('请输入内容'); |
|||
return false; |
|||
} |
|||
app.post('ApiLuntan/fatie', {cid: cid,pics: pics,content: content,video: video}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 1) { |
|||
app.success(res.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(res.msg); |
|||
} |
|||
}); |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pic') that.pic = pics; |
|||
if(field == 'pics') that.pics = pics; |
|||
if(field == 'zhengming') that.zhengming = pics; |
|||
},1) |
|||
}, |
|||
uploadvideo: function () { |
|||
var that = this; |
|||
console.log(11); |
|||
uni.chooseVideo({ |
|||
sourceType: ['album', 'camera'], |
|||
maxDuration: 60, |
|||
success: function (res) { |
|||
var tempFilePath = res.tempFilePath; |
|||
app.showLoading('上传中'); |
|||
uni.uploadFile({ |
|||
url: app.globalData.baseurl + 'ApiImageupload/uploadImg/aid/' + app.globalData.aid + '/platform/' + app.globalData.platform + '/session_id/' + app.globalData.session_id, |
|||
filePath: tempFilePath, |
|||
name: 'file', |
|||
success: function (res) { |
|||
app.showLoading(false); |
|||
var data = JSON.parse(res.data); |
|||
|
|||
if (data.status == 1) { |
|||
that.video = data.url; |
|||
} else { |
|||
app.alert(data.msg); |
|||
} |
|||
}, |
|||
fail: function (res) { |
|||
app.showLoading(false); |
|||
app.alert(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
fail: function (res) { |
|||
console.log(res); //alert(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
removeimg:function(e){ |
|||
var that = this; |
|||
var index= e.currentTarget.dataset.index |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
pics.splice(index,1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
page{background:#f7f7f7} |
|||
.st_box{ padding: 20rpx 0 } |
|||
.st_title{ display: flex; justify-content: space-between;padding:24rpx; } |
|||
.st_title1{ display: flex; justify-content: space-between;padding:24rpx;border-bottom: 1px solid #D0D0D0 } |
|||
.st_title image{width: 18rpx;height:32rpx} |
|||
.st_title text{ color:#242424; font-size: 36rpx} |
|||
/* .st_title button{ background: #31C88E; border-radius:6rpx; line-height: 48rpx;border: none; padding:0 20rpx ;color:#fff;margin:0} */ |
|||
|
|||
|
|||
.st_title button{ |
|||
background: #1658c6; |
|||
border-radius: 3px; |
|||
line-height: 24px; |
|||
border: none; |
|||
padding: 0 10px; |
|||
color: #fff; |
|||
font-size: 20px; |
|||
text-align: center; |
|||
/* margin: 0; */ |
|||
width: 300px; |
|||
display: flex; |
|||
height: 50px; |
|||
justify-content: center; |
|||
align-items: center;} |
|||
|
|||
|
|||
|
|||
.st_form{ padding: 24rpx;background: #ffffff;margin: 10px;border-radius: 15px;} |
|||
.st_form input{ width: 100%;height: 120rpx; border: none;border-bottom:1px solid #EEEEEE;} |
|||
.st_form input::-webkit-input-placeholder { /* WebKit browsers */ color: #BBBBBB; font-size: 24rpx} |
|||
.st_form textarea{ width:100%;min-height:200rpx;padding:20rpx 0;border: none;border-bottom:1px solid #EEEEEE;} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;z-index:90;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
.uploadbtn_ziti1{height:30rpx; line-height: 30rpx;font-size:30rpx; margin-top: 20rpx;} |
|||
.uploadbtn_ziti2{height:30rpx; line-height: 30rpx;font-size:30rpx; padding-top: 20rpx; margin-top: 20rpx;border-top:1px solid #EEEEEE;} |
|||
</style> |
|||
@ -0,0 +1,188 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="搜索感兴趣的帖子" placeholder-style="font-size:24rpx;color:#C2C2C2" @confirm="searchConfirm"></input> |
|||
</view> |
|||
</view> |
|||
<view class="container2"> |
|||
<image :src="banner" style="width:100%;height:auto" mode="widthFix" v-if="banner"></image> |
|||
<view class="datalist"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="item" @tap="goto" :data-url="'detail?id=' + item.id"> |
|||
<view class="top"> |
|||
<image :src="item.headimg" class="f1"></image> |
|||
<view class="f2"> |
|||
<view class="t1">{{item.nickname}}</view> |
|||
<view class="t2">{{item.showtime}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="con"> |
|||
<view class="f1"><text style="white-space:pre-wrap;">{{item.content}}</text></view> |
|||
<view class="f2" v-if="item.pics"> |
|||
<image v-for="(pic, idx) in item.pics" :key="idx" :src="pic" mode="widthFix" style="height:auto"></image> |
|||
</view> |
|||
<video class="video" id="video" :src="item.video" v-if="item.video" @tap.stop="playvideo"></video> |
|||
</view> |
|||
<view class="bot"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/img/lt_read.png'" style="margin-top:0"></image>{{item.readcount}}</view> |
|||
<view class="f1" style="margin-left:60rpx;"><image :src="event_rul +'/static/img/static/img/lt_pinglun.png'"></image>{{item.plcount}}</view> |
|||
<view class="f2"></view> |
|||
<view class="f3" @tap.stop="zan" :data-id="item.id" :data-index="index"><image :src="event_rul +'/static/img/static/img/lt_like' + (item['iszan']==0?'':'2') + '.png'"></image>{{item.zan}}</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
</view> |
|||
<view class="covermy" :class="menuindex>-1?'tabbarbot':'notabbarbot'" @tap="goto" :data-url="'fatie?cid=' + cid"><image :src="pre_url+'/static/img/lt_fatie.png'"></image></view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
cid:'', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
keyword: '', |
|||
nomore: false, |
|||
nodata: false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.cid = this.opt.cid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiLuntan/ltlist', {cid: that.cid,pagenum: pagenum,keyword:keyword}, function (res) { |
|||
that.loading = false; |
|||
that.loaddingmore = false; |
|||
var data = res.datalist; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
uni.setNavigationBarTitle({ |
|||
title: res.title |
|||
}); |
|||
that.pernum = res.pernum; |
|||
that.datalist = res.datalist; |
|||
that.banner = res.banner; |
|||
that.title = res.title; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.getdata(); |
|||
}, |
|||
zan: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var index = e.currentTarget.dataset.index; |
|||
var datalist = that.datalist; |
|||
app.post("ApiLuntan/zan", {id: id}, function (res) { |
|||
if (res.type == 0) { |
|||
//取消点赞 |
|||
datalist[index].iszan = 0; |
|||
datalist[index].zan = datalist[index].zan - 1; |
|||
} else { |
|||
datalist[index].iszan = 1; |
|||
datalist[index].zan = datalist[index].zan + 1; |
|||
} |
|||
that.datalist = datalist; |
|||
}); |
|||
}, |
|||
playvideo: function () {} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container2{width:100%;padding:20rpx;background:#fff;} |
|||
|
|||
.topsearch{width:100%;padding:20rpx 20rpx;margin-bottom:10rpx;margin-bottom:10rpx;background:#fff} |
|||
.topsearch .f1{height:70rpx;border-radius:35rpx;border:0;background-color:#f5f5f5;flex:1} |
|||
.topsearch .f1 image{width:30rpx;height:30rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
|
|||
.navbox{background: #fff;height: auto;overflow: hidden;} |
|||
.nav_li{width:25%;text-align: center;box-sizing: border-box;padding:30rpx 0 10rpx;float: left;color:#222;font-size:24rpx} |
|||
.nav_li image{width:80rpx;height: 80rpx;margin-bottom:10rpx;} |
|||
|
|||
.listtitle{width:100%;padding:0 24rpx;color:#222;font-weight:bold;font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.datalist{width:100%;padding:0 24rpx;} |
|||
.datalist .item{width:100%;display:flex;flex-direction:column;padding:24rpx 0;border-bottom:1px solid #f1f1f1} |
|||
.datalist .item .top{width:100%;display:flex;align-items:center} |
|||
.datalist .item .top .f1{width:80rpx;height:80rpx;border-radius:50%;margin-right:16rpx} |
|||
.datalist .item .top .f2 .t1{color:#222;font-weight:bold;font-size:28rpx} |
|||
.datalist .item .top .f2 .t2{color:#bbb;font-size:24rpx} |
|||
.datalist .item .con{width:100%;padding:24rpx 0;display:flex;flex-direction:column;color:#000} |
|||
.datalist .item .con .f2{margin-top:10rpx;display:flex;flex-wrap:wrap} |
|||
.datalist .item .con .f2 image{width:31%;margin-right:2%;margin-bottom:10rpx;border-radius:8rpx} |
|||
.datalist .item .con .video{width:80%;height:300rpx;margin-top:20rpx} |
|||
.datalist .item .bot{width:100%;display:flex;align-items:center;color:#222222;font-size:28rpx} |
|||
.datalist .item .bot .f1{display:flex;align-items:center;font-weight:bold} |
|||
.datalist .item .bot .f1 image{width:36rpx;height:36rpx;margin-right:16rpx;margin-top:2px} |
|||
.datalist .item .bot .f2{flex:1;} |
|||
.datalist .item .bot .f3{display:flex;align-items:center;font-weight:bold} |
|||
.datalist .item .bot .f3 image{width:40rpx;height:40rpx;margin-right:16rpx} |
|||
.datalist .item .bot .btn2{color:#fff;background:#FE1A29;border:1px solid #FE1A29;padding:6rpx 40rpx;font-size:24rpx;border-radius:40rpx;margin-left:16rpx} |
|||
|
|||
.covermy{position:fixed;z-index:99999;bottom:0;right:0;width:130rpx;height:130rpx;box-sizing:content-box} |
|||
.covermy image{width:100%;height:100%} |
|||
|
|||
.nomore-footer-tips{background:#fff!important} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="box2"> |
|||
<view class="header"> |
|||
<view class="f1" @tap="goback"><text class="fa fa-angle-left"></text></view> |
|||
<view class="f2" id="box2_title">{{title}}</view> |
|||
<view class="f3" @tap="subpinglun">发表</view> |
|||
</view> |
|||
<textarea style="width:100%;height:50vh" placeholder="写评论..." id="editcontent" :value="content" @input="setcontent"></textarea> |
|||
<view style="height:100rpx"></view> |
|||
<view class="bottom"> |
|||
<view @tap="showface"><image :src="event_rul + '/static/img/static/img/emote.png'"></image></view> |
|||
</view> |
|||
<wxface v-if="faceshow" @selectface="selectface"></wxface> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
title: '发表评论', |
|||
type: 0, |
|||
id: '', |
|||
hfid: '', |
|||
faceshow: false, |
|||
content: '', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.type = this.opt.type |
|||
this.id = this.opt.id |
|||
this.hfid = this.opt.hfid |
|||
if (this.hfid) { |
|||
this.title = '回复评论'; |
|||
} |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata(){ |
|||
this.loaded(); |
|||
}, |
|||
showface: function () { |
|||
this.faceshow = !this.faceshow; |
|||
}, |
|||
selectface: function (face) { |
|||
var content = this.content + face; |
|||
this.faceshow = false; |
|||
this.content = content; |
|||
}, |
|||
setcontent: function (e) { |
|||
this.content = e.detail.value; |
|||
}, |
|||
subpinglun: function () { |
|||
var that = this; |
|||
var id = that.id; |
|||
var type = that.type; |
|||
var hfid = that.hfid; |
|||
var content = that.content; |
|||
|
|||
if (content == '') { |
|||
app.error('请输入评论内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post("ApiLuntan/subpinglun", {id: id,type: type,hfid: hfid,content: content}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 1) { |
|||
app.success(res.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(res.msg); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
/* m/dietitian/detail.wxss */ |
|||
page{ background: #fff} |
|||
|
|||
.box2{background:#fff;height:100vh;} |
|||
.box2 .header{width:100%;height:92rpx;line-height:92rpx;background:#fafafa;border-bottom:1px solid #cfcfcf;display:flex;text-align:center} |
|||
.box2 .header .f1{width:80rpx;font-size:44rpx} |
|||
.box2 .header .f2{flex:1;font-size:32rpx;color:#111} |
|||
.box2 .header .f3{width:100rpx;font-size:32rpx;color:#1b9af4} |
|||
.box2 textarea{width:100%;height:80vh;border:0;color:#333;padding:20rpx;font-size:32rpx} |
|||
.box2 .bottom{width:100%;max-width:750px;margin:0 auto;position:fixed;display:flex;align-items:center;bottom:0;left:0;right:0;height:100rpx;background:#fff;z-index:996;border-top:1px solid #f7f7f7;padding:0 20rpx} |
|||
.box2 .bottom image{width:60rpx;height:60rpx} |
|||
|
|||
.plbox{width:100%;padding:40rpx 20rpx} |
|||
.plbox_title{font-size:28rpx;height:6rpx;line-height:6rpx;margin-bottom:20rpx} |
|||
.plbox_title .t1{color:#000;font-weight:bold} |
|||
.plbox_content .plcontent{vertical-align: middle;color:#111} |
|||
.plbox_content .plcontent image{ width:44rpx;height:44rpx;vertical-align: inherit;} |
|||
.plbox_content .item1{width:100%;margin-bottom:20rpx} |
|||
.plbox_content .item1 .f1{width:80rpx;} |
|||
.plbox_content .item1 .f1 image{width:60rpx;height:60rpx;border-radius:50%} |
|||
.plbox_content .item1 .f2{flex:1} |
|||
.plbox_content .item1 .f2 .t1{} |
|||
.plbox_content .item1 .f2 .t2{color:#000;margin:10rpx 0;line-height:60rpx;} |
|||
.plbox_content .item1 .f2 .t3{color:#999;font-size:20rpx} |
|||
.plbox_content .item1 .f2 .pzan image{width:32rpx;height:32rpx;margin-right:2px} |
|||
.plbox_content .item1 .f2 .phuifu{margin-left:6px;color:#507DAF} |
|||
.plbox_content .relist{width:100%;background:#f5f5f5;padding:4rpx 20rpx;margin-bottom:20rpx} |
|||
.plbox_content .relist .item2{font-size:24rpx;margin-bottom:10rpx} |
|||
|
|||
.copyright{display:none} |
|||
</style> |
|||
@ -0,0 +1,12 @@ |
|||
.tabbar{height: auto; position: relative;} |
|||
.tabbar-icon {width: 50rpx;height: 50rpx;} |
|||
.tabbar-bar {display: flex;flex-direction: row;width: 100%;height:100rpx;position: fixed;bottom: 0;padding:10rpx 0 0 0;background: #fff;font-size: 24rpx;color: #999;border-top: 1px solid #e5e5e5;z-index: 8;box-sizing:content-box} |
|||
.tabbar-item {flex: 1;text-align: center;overflow: hidden;} |
|||
.tabbar-image-box {height: 54rpx;margin-bottom: 4rpx;} |
|||
.tabbar-text {line-height: 30rpx;font-size: 24rpx;color:#222222} |
|||
.tabbar-text.active{color:#06A051} |
|||
.tabbar-bot{height:110rpx;width:100%;box-sizing:content-box} |
|||
@supports(bottom: env(safe-area-inset-bottom)){ |
|||
.tabbar-bot{padding-bottom:env(safe-area-inset-bottom);} |
|||
.tabbar-bar{padding-bottom:env(safe-area-inset-bottom);} |
|||
} |
|||
@ -0,0 +1,321 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view> |
|||
<view class="search-container"> |
|||
<view class="search-box"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/search_ico.png'"></image> |
|||
<input class="search-text" placeholder="搜索商家" placeholder-style="color:#aaa;font-size:24rpx" @confirm="searchConfirm"/> |
|||
</view> |
|||
</view> |
|||
<block v-for="(item, index) in datalist" :key="item.id"> |
|||
<view class="order-box" @tap="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
|
|||
<view class="f1" v-if="item.leftminute>0"><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/><text class="t1">{{item.leftminute}}分钟内</text> 送达</view> |
|||
<view class="f1" v-else><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/>已超时<text class="t1" style="margin-left:10rpx">{{-item.leftminute}}分钟</text></view> |
|||
<view class="flex1"></view> |
|||
<view class="f2"><text class="t1">{{item.ticheng}}</text>元</view> |
|||
</view> |
|||
<view class="content"> |
|||
<view class="f1"> |
|||
<view class="t1"><text class="x1">{{item.juli}}</text><text class="x2">{{item.juli_unit}}</text></view> |
|||
<view class="t2"><image :src="event_rul +'/static/img/static/peisong/ps_juli.png'" class="img"/></view> |
|||
<view class="t3"><text class="x1">{{item.juli2}}</text><text class="x2">{{item.juli2_unit}}</text></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">{{item.binfo.name}}</view> |
|||
<view class="t2">{{item.binfo.address}}</view> |
|||
<view class="t3">{{item.orderinfo.address}}</view> |
|||
<view class="t2">{{item.orderinfo.area}}</view> |
|||
</view> |
|||
<view class="f3" @tap.stop="daohang" :data-index="index"><image :src="event_rul +'/static/img/static/peisong/ps_daohang.png'" class="img"/></view> |
|||
</view> |
|||
<view class="op"> |
|||
<view class="flex1"></view> |
|||
<view class="btn1" @tap.stop="qiangdan" :data-id="item.id">抢单</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<!-- <view style="width:100%;height:120rpx"></view> --> |
|||
<!-- <view class="bottom"> |
|||
<view class="my"> |
|||
<image :src="event_rul +'/static/img/static/img/my.png'" class="img"/> |
|||
<text>我的</text> |
|||
</view> |
|||
<view class="btn1" @tap="setpsst" data-st="1" v-if="psuser.status==0">暂停接单中</view> |
|||
<view class="btn2" :style="{background:t('color1')}" @tap="setpsst" data-st="0" v-if="psuser.status==1">开启接单中</view> |
|||
</view> --> |
|||
|
|||
<view class="tabbar"> |
|||
<view class="tabbar-bot"></view> |
|||
<view class="tabbar-bar" style="background-color:#ffffff"> |
|||
<view @tap="goto" data-url="dating" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/home2.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text active">大厅</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/order.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">订单</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist?st=4" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/orderwc.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">已完成</view> |
|||
</view> |
|||
<view @tap="goto" data-url="my" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/my.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">我的</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
<view style="display:none">{{timestamp}}</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
interval1:null, |
|||
timestamp:'', |
|||
nowtime:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onUnload:function(){ |
|||
clearInterval(this.interval1); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var st = that.st; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiPeisong/dating', {st: st,pagenum: pagenum,keyword:keyword}, function (res) { |
|||
that.loading = false; |
|||
if(res.status==0){ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
that.nowtime = res.nowtime |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
that.updatemylocation(false); |
|||
clearInterval(that.interval1); |
|||
that.interval1 = setInterval(function(){ |
|||
that.updatemylocation(true); |
|||
that.nowtime = that.nowtime + 10; |
|||
},10000) |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
updatemylocation:function(needload){ |
|||
console.log('updatemylocation'); |
|||
var that = this; |
|||
app.getLocation(function(res){ |
|||
var longitude = res.longitude; |
|||
var latitude = res.latitude; |
|||
var datalist = that.datalist; |
|||
for(var i in datalist){ |
|||
var thisdata = datalist[i]; |
|||
var rs = that.getdistance(thisdata.longitude2,thisdata.latitude2,longitude,latitude,1); |
|||
thisdata.juli2 = rs.juli; |
|||
thisdata.juli2_unit = rs.unit; |
|||
thisdata.leftminute = parseInt((thisdata.yujitime - that.nowtime) / 60); |
|||
datalist[i] = thisdata; |
|||
} |
|||
that.datalist = datalist; |
|||
that.timestamp = parseInt((new Date().getTime())/1000); |
|||
app.get('ApiPeisong/updatemylocation',{longitude:longitude,latitude:latitude,t:that.timestamp},function(){ |
|||
//if(needload) that.getdata(); |
|||
}); |
|||
}); |
|||
}, |
|||
getdistance: function (lng1, lat1, lng2, lat2) { |
|||
if(!lat1 || !lng1 || !lat2 || !lng2) return ''; |
|||
var rad1 = lat1 * Math.PI / 180.0; |
|||
var rad2 = lat2 * Math.PI / 180.0; |
|||
var a = rad1 - rad2; |
|||
var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0; |
|||
var r = 6378137; |
|||
var juli = r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) * Math.pow(Math.sin(b / 2), 2))); |
|||
var unit = 'm'; |
|||
if(juli> 1000){ |
|||
juli = juli/1000; |
|||
unit = 'km'; |
|||
} |
|||
juli = juli.toFixed(1); |
|||
return {juli:juli,unit:unit} |
|||
}, |
|||
qiangdan: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var st = e.currentTarget.dataset.st; |
|||
app.confirm('确定要接单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiPeisong/qiangdan', {id: id}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
daohang:function(e){ |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
var datainfo = that.datalist[index]; |
|||
uni.showActionSheet({ |
|||
itemList: ['导航到商家', '导航到用户'], |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
if (res.tapIndex == 0) { |
|||
var longitude = datainfo.longitude |
|||
var latitude = datainfo.latitude |
|||
var name = datainfo.binfo.name |
|||
var address = datainfo.binfo.address |
|||
}else{ |
|||
var longitude = datainfo.longitude2 |
|||
var latitude = datainfo.latitude2 |
|||
var name = datainfo.orderinfo.address |
|||
var address = datainfo.orderinfo.address |
|||
} |
|||
uni.openLocation({ |
|||
latitude:parseFloat(latitude), |
|||
longitude:parseFloat(longitude), |
|||
name:name, |
|||
address:address, |
|||
scale: 13, |
|||
success: function () { |
|||
console.log('success'); |
|||
}, |
|||
fail:function(res){ |
|||
console.log(res); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.getdata(); |
|||
}, |
|||
receiveMessage: function (data) { |
|||
var that = this; |
|||
if(data.type == 'peisong' || data.type == 'peisong_jiedan') { |
|||
that.getdata(); |
|||
} |
|||
return false; |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
@import "./common.css"; |
|||
.container{ width:100%;display:flex;flex-direction:column} |
|||
.search-container {width: 100%;height:100rpx;padding: 20rpx 23rpx 20rpx 23rpx;background-color: #fff;position: relative;overflow: hidden;border-bottom:1px solid #f5f5f5} |
|||
.search-box {display:flex;align-items:center;height:60rpx;border-radius:30rpx;border:0;background-color:#f7f7f7;flex:1} |
|||
.search-box .img{width:24rpx;height:24rpx;margin-right:10rpx;margin-left:30rpx} |
|||
.search-box .search-text {font-size:24rpx;color:#222;width: 100%;} |
|||
|
|||
.order-box{ width: 94%;margin:20rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f5f5f5 solid; height:88rpx; line-height:88rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#222222} |
|||
.order-box .head .f1 .img{width:24rpx;height:24rpx;margin-right:4px} |
|||
.order-box .head .f1 .t1{color:#06A051;margin-right:10rpx} |
|||
.order-box .head .f2{color:#FF6F30} |
|||
.order-box .head .f2 .t1{font-size:36rpx;margin-right:4rpx} |
|||
|
|||
.order-box .content{display:flex;justify-content:space-between;width: 100%; padding:16rpx 0px;border-bottom: 1px solid #f5f5f5;position:relative} |
|||
.order-box .content .f1{width:100rpx;display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t1 .x2{color:#999999;font-size:24rpx;margin-bottom:8rpx} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx; margin: 10rpx 0;} |
|||
|
|||
.order-box .content .f1 .t3{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t3 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t3 .x2{color:#999999;font-size:24rpx} |
|||
.order-box .content .f2{flex:1;padding:0 20rpx} |
|||
.order-box .content .f2 .t1{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-bottom:6rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f2 .t2{font-size:28rpx;color:#222222;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;} |
|||
.order-box .content .f2 .t3{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-top:30rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f3 .img{width:72rpx;height:168rpx} |
|||
|
|||
.order-box .op{display:flex;justify-content:flex-end;align-items:center;width:100%; padding:20rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op .btn1{width:100%;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%);;height:88rpx;line-height:88rpx;color:#fff;border-radius:10rpx;text-align:center;font-size:32rpx} |
|||
|
|||
</style> |
|||
@ -0,0 +1,140 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['余额明细','提现记录']" :itemst="['0','2']" :st="st" :isfixed="true" @changetab="changetab" color1="#06A051"></dd-tab> |
|||
<view class="content"> |
|||
<block v-if="st==0"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<text class="t1">{{item.remark}}</text> |
|||
<text class="t2">{{date(item.createtime)}}</text> |
|||
<text class="t3">变更后余额: {{item.after}}</text> |
|||
</view> |
|||
<view class="f2"> |
|||
<text class="t1" v-if="item.money>0">+{{item.money}}</text> |
|||
<text class="t2" v-else>{{item.money}}</text> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<block v-if="st==2"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<text class="t1">提现金额:{{item.money}}元</text> |
|||
<text class="t2">{{date(item.createtime)}}</text> |
|||
</view> |
|||
<view class="f3"> |
|||
<text class="t1" v-if="item.status==0">审核中</text> |
|||
<text class="t1" v-if="item.status==1">已审核</text> |
|||
<text class="t2" v-if="item.status==2">已驳回</text> |
|||
<text class="t1" v-if="item.status==3">已打款</text> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
canwithdraw:false, |
|||
textset:{}, |
|||
st: 0, |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nodata:false, |
|||
nomore: false |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st || 0; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(true); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiPeisong/moneylog', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.textset = app.globalData.textset; |
|||
that.canwithdraw = res.canwithdraw; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;margin-top:90rpx;display:flex;flex-direction:column} |
|||
.content{ width:94%;margin:0 3% 20rpx 3%;} |
|||
.content .item{width:100%;background:#fff;margin:20rpx 0;padding:20rpx 20rpx;border-radius:8px;display:flex;align-items:center} |
|||
.content .item:last-child{border:0} |
|||
.content .item .f1{width:500rpx;display:flex;flex-direction:column} |
|||
.content .item .f1 .t1{color:#000000;font-size:30rpx;word-break:break-all;overflow:hidden;text-overflow:ellipsis;} |
|||
.content .item .f1 .t2{color:#666666} |
|||
.content .item .f1 .t3{color:#666666} |
|||
.content .item .f2{ flex:1;width:200rpx;font-size:36rpx;text-align:right} |
|||
.content .item .f2 .t1{color:#03bc01} |
|||
.content .item .f2 .t2{color:#000000} |
|||
.content .item .f3{ flex:1;width:200rpx;font-size:32rpx;text-align:right} |
|||
.content .item .f3 .t1{color:#03bc01} |
|||
.content .item .f3 .t2{color:#000000} |
|||
|
|||
.data-empty{background:#fff} |
|||
</style> |
|||
@ -0,0 +1,217 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<view class="banner"> |
|||
<image :src="psuser.headimg" background-size="cover"/> |
|||
<view class="info"> |
|||
<text class="nickname">{{psuser.realname}}</text> |
|||
<text>{{psuser.tel}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="contentdata"> |
|||
<view class="custom_field"> |
|||
<view class='item' data-url='orderlist?st=4' @tap='goto'> |
|||
<text class="t1">累计配送</text> |
|||
<text class='t2'>{{psuser.totalnum}}份</text> |
|||
</view> |
|||
<view class='item'> |
|||
<text class="t1">总收入</text> |
|||
<text class='t2'>{{psuser.totalmoney}}元</text> |
|||
</view> |
|||
<view class='item'> |
|||
<text class="t1">好评率</text> |
|||
<text class='t2'>{{psuser.comment_haopercent}}%</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="listcontent"> |
|||
<view class="list"> |
|||
<view class="item" @tap="goto" data-url="withdraw"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-qianbao.png'"></image></view> |
|||
<view class="f2">我的钱包</view> |
|||
<text class="f3">余额:{{psuser.money}}</text> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f4"></image> |
|||
</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="item" @tap="goto" data-url="moneylog"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-zhangdan.png'"></image></view> |
|||
<view class="f2">账单明细</view> |
|||
<text class="f3"></text> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f4"></image> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="list"> |
|||
<view class="item" @tap="goto" data-url="moneylog"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-order.png'"></image></view> |
|||
<view class="f2">配送记录</view> |
|||
<text class="f3"></text> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f4"></image> |
|||
</view> |
|||
</view> --> |
|||
<view class="list"> |
|||
<view class="item"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-jiedan.png'"></image></view> |
|||
<view class="f2">接单状态</view> |
|||
<text class="f3"><switch value="1" :checked="psuser.status==1?true:false" @change="switchchange"></switch></text> |
|||
</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="item" @tap="goto" data-url="setinfo"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-shenfen.png'"></image></view> |
|||
<view class="f2">提现设置</view> |
|||
<text class="f3"></text> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f4"></image> |
|||
</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="item" @tap="goto" data-url="/pages/index/login"> |
|||
<view class="f1"><image :src="event_rul +'/static/img/static/peisong/ico-logout.png'"></image></view> |
|||
<view class="f2">退出登录</view> |
|||
<text class="f3"></text> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f4"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="tabbar"> |
|||
<view class="tabbar-bot"></view> |
|||
<view class="tabbar-bar" style="background-color:#ffffff"> |
|||
<view @tap="goto" data-url="dating" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/home.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">大厅</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/order.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">订单</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist?st=4" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/orderwc.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">已完成</view> |
|||
</view> |
|||
<view @tap="goto" data-url="my" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/my2.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text active">我的</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
set:{}, |
|||
psuser:{}, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiPeisong/my', {}, function (res) { |
|||
that.loading = false; |
|||
//that.set = res.set; |
|||
that.psuser = res.psuser; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
switchchange: function (e) { |
|||
console.log(e); |
|||
var value = e.detail.value ? 1 : 0; |
|||
app.post('ApiPeisong/setpsst', {st: value}, function (data) {}); |
|||
}, |
|||
saoyisao: function (d) { |
|||
var that = this; |
|||
if(app.globalData.platform == 'h5'){ |
|||
app.alert('请使用微信扫一扫功能扫码核销');return; |
|||
}else if(app.globalData.platform == 'mp'){ |
|||
var jweixin = require('jweixin-module'); |
|||
jweixin.ready(function () { //需在用户可能点击分享按钮前就先调用 |
|||
jweixin.scanQRCode({ |
|||
needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果, |
|||
scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有 |
|||
success: function (res) { |
|||
var content = res.resultStr; // 当needResult 为 1 时,扫码返回的结果 |
|||
var params = content.split('?')[1]; |
|||
app.goto('/admin/hexiao/hexiao?'+params); |
|||
//if(content.length == 18 && (/^\d+$/.test(content))){ //是十八位数字 付款码 |
|||
// location.href = "{:url('shoukuan')}/aid/{$aid}/auth_code/"+content |
|||
//}else{ |
|||
// location.href = content; |
|||
//} |
|||
} |
|||
}); |
|||
}); |
|||
}else{ |
|||
uni.scanCode({ |
|||
success: function (res) { |
|||
console.log(res); |
|||
var content = res.result; |
|||
var params = content.split('?')[1]; |
|||
app.goto('/admin/hexiao/hexiao?'+params); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
@import "./common.css"; |
|||
.banner{ display:flex;width:100%;height:322rpx;padding:80rpx 32rpx 40rpx 32rpx;color:#fff;position:relative; |
|||
background: linear-gradient(-45deg, #06A051 0%, #03B269 100%);} |
|||
.banner image{ width:120rpx;height:120rpx;border-radius:50%;margin-right:20rpx} |
|||
.banner .info{display:flex;flex:auto;flex-direction:column;padding-top:10rpx} |
|||
.banner .info .nickname{font-size:32rpx;font-weight:bold;padding-bottom:12rpx} |
|||
.banner .set{ width:70rpx;height:100rpx;line-height:100rpx;font-size:40rpx;text-align:center} |
|||
.banner .set image{width:50rpx;height:50rpx;border-radius:0} |
|||
|
|||
.contentdata{display:flex;flex-direction:column;width:100%;padding:0 30rpx;margin-top:-100rpx;position:relative;margin-bottom:20rpx} |
|||
|
|||
.custom_field{display:flex;width:100%;align-items:center;padding:30rpx 8rpx;background:#fff;border-radius:16rpx} |
|||
.custom_field .item{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center} |
|||
.custom_field .item .t1{color:#666;font-size:26rpx;margin-top:10rpx} |
|||
.custom_field .item .t2{color:#111;font-weight:bold;font-size:36rpx;margin-top:20rpx} |
|||
|
|||
.score{ display:flex;width:100%;align-items:center;padding:10rpx 20rpx;background:#fff;border-top:1px dotted #eee} |
|||
.score .f1 .t2{color:#ff3300} |
|||
|
|||
.list{ width: 100%;background: #fff;margin-top:20rpx;padding:0 20rpx;font-size:30rpx;margin-bottom:20rpx;border-radius:16rpx} |
|||
.list .item{ height:100rpx;display:flex;align-items:center;border-bottom:1px solid #eee} |
|||
.list .item:last-child{border-bottom:0;margin-bottom:20rpx} |
|||
.list .f1{width:50rpx;height:50rpx;line-height:50rpx;display:flex;align-items:center} |
|||
.list .f1 image{ width:44rpx;height:44rpx;} |
|||
.list .f1 span{ width:40rpx;height:40rpx;font-size:40rpx} |
|||
.list .f2{color:#222;font-weight:bold;margin-left:10rpx} |
|||
.list .f3{ color:#06A051;font-size:26rpx;text-align:right;flex:1} |
|||
.list .f4{ width: 40rpx; height: 40rpx;} |
|||
|
|||
switch{transform:scale(.7);} |
|||
</style> |
|||
@ -0,0 +1,334 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
|
|||
<map v-if="psorder.status!=4" class="map" :longitude="binfo.longitude" :latitude="binfo.latitude" scale="14" :markers="[{ |
|||
id:0, |
|||
latitude:binfo.latitude, |
|||
longitude:binfo.longitude, |
|||
iconPath: event_rul +'/static/img/static/peisong/marker_business.png', |
|||
width:'44', |
|||
height:'54' |
|||
},{ |
|||
id:0, |
|||
latitude:orderinfo.latitude, |
|||
longitude:orderinfo.longitude, |
|||
iconPath: event_rul +'/static/img/static/peisong/marker_kehu.png', |
|||
width:'44', |
|||
height:'54' |
|||
},{ |
|||
id:0, |
|||
latitude:psuser.latitude, |
|||
longitude:psuser.longitude, |
|||
iconPath: event_rul +'/static/img/static/peisong/marker_qishou.png', |
|||
width:'44', |
|||
height:'54' |
|||
}]"></map> |
|||
<map v-else class="map" :longitude="binfo.longitude" :latitude="binfo.latitude" scale="14" :markers="[{ |
|||
id:0, |
|||
latitude:binfo.latitude, |
|||
longitude:binfo.longitude, |
|||
iconPath: event_rul +'/static/img/static/peisong/marker_business.png', |
|||
width:'44', |
|||
height:'54' |
|||
},{ |
|||
id:0, |
|||
latitude:orderinfo.latitude, |
|||
longitude:orderinfo.longitude, |
|||
iconPath: event_rul +'/static/img/static/peisong/marker_kehu.png', |
|||
width:'44', |
|||
height:'54' |
|||
}]"></map> |
|||
|
|||
<view class="order-box"> |
|||
<view class="head"> |
|||
<view class="f1" v-if="psorder.status==4"><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/>已送达</view> |
|||
<view class="f1" v-else-if="psorder.leftminute>0"><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/><text class="t1">{{psorder.leftminute}}分钟内</text> 送达</view> |
|||
<view class="f1" v-else><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/>已超时<text class="t1" style="margin-left:10rpx">{{-psorder.leftminute}}分钟</text></view> |
|||
<view class="flex1"></view> |
|||
<view class="f2"><text class="t1">{{psorder.ticheng}}</text>元</view> |
|||
</view> |
|||
<view class="content" style="border-bottom:0"> |
|||
<view class="f1"> |
|||
<view class="t1"><text class="x1">{{psorder.juli}}</text><text class="x2">{{psorder.juli_unit}}</text></view> |
|||
<view class="t2"><image :src="event_rul +'/static/img/static/peisong/ps_juli.png'" class="img"/></view> |
|||
<view class="t3"><text class="x1">{{psorder.juli2}}</text><text class="x2">{{psorder.juli2_unit}}</text></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">{{binfo.name}}</view> |
|||
<view class="t2">{{binfo.address}}</view> |
|||
<view class="t3">{{orderinfo.address}}</view> |
|||
<view class="t2">{{orderinfo.area}}</view> |
|||
</view> |
|||
<view class="f3" @tap.stop="daohang"><image :src="event_rul +'/static/img/static/peisong/ps_daohang.png'" class="img"/></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="box-title">商品清单({{orderinfo.procount}})</view> |
|||
<view v-for="(item, idx) in prolist" :key="idx" class="item"> |
|||
<text class="t1 flex1">{{item.name}} {{item.ggname}}</text> |
|||
<text class="t2 flex0">¥{{item.sell_price}} ×{{item.num}} </text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="psorder.status!=0"> |
|||
<view class="box-title">配送信息</view> |
|||
<view class="item"> |
|||
<text class="t1">接单时间</text> |
|||
<text class="t2">{{date(psorder.starttime)}}</text> |
|||
</view> |
|||
<view class="item" v-if="psorder.daodiantime"> |
|||
<text class="t1">到店时间</text> |
|||
<text class="t2">{{date(psorder.daodiantime)}}</text> |
|||
</view> |
|||
<view class="item" v-if="psorder.quhuotime"> |
|||
<text class="t1">取货时间</text> |
|||
<text class="t2">{{date(psorder.quhuotime)}}</text> |
|||
</view> |
|||
<view class="item" v-if="psorder.endtime"> |
|||
<text class="t1">送达时间</text> |
|||
<text class="t2">{{date(psorder.endtime)}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="box-title">订单信息</view> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{orderinfo.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{date(orderinfo.createtime)}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{date(orderinfo.paytime)}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">支付方式</text> |
|||
<text class="t2">{{orderinfo.paytype}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{orderinfo.product_price}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{orderinfo.totalprice}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">备注</text> |
|||
<text class="t2 red">{{orderinfo.message ? orderinfo.message : '无'}}</text> |
|||
</view> |
|||
</view> |
|||
<view style="width:100%;height:180rpx"></view> |
|||
<view class="bottom notabbarbot" v-if="psorder.status!=4"> |
|||
<view class="f1" v-if="psorder.status!=0" @tap="call" :data-tel="orderinfo.tel"><image :src="event_rul +'/static/img/static/peisong/tel1.png'" class="img"/>联系顾客</view> |
|||
<view class="f2" v-if="psorder.status!=0" @tap="call" :data-tel="binfo.tel"><image :src="event_rul +'/static/img/static/peisong/tel2.png'" class="img"/>联系商家</view> |
|||
<view class="btn1" @tap="qiangdan" :data-id="psorder.id" v-if="psorder.status==0">立即抢单</view> |
|||
<view class="btn1" @tap="setst" :data-id="psorder.id" data-st="2" v-if="psorder.status==1">我已到店</view> |
|||
<view class="btn1" @tap="setst" :data-id="psorder.id" data-st="3" v-if="psorder.status==2">我已取货</view> |
|||
<view class="btn1" @tap="setst" :data-id="psorder.id" data-st="4" v-if="psorder.status==3">我已送达</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderinfo: {}, |
|||
prolist: [], |
|||
psuser:{}, |
|||
binfo: {}, |
|||
psorder: {}, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiPeisong/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
if(res.status == 0) { |
|||
app.alert(res.msg);return; |
|||
} |
|||
that.orderinfo = res.orderinfo; |
|||
that.prolist = res.prolist; |
|||
that.binfo = res.binfo; |
|||
that.psorder = res.psorder; |
|||
that.psuser = res.psuser; |
|||
that.loaded(); |
|||
that.updatemylocation(false); |
|||
setTimeout(function(){ |
|||
that.updatemylocation(true); |
|||
},10000) |
|||
}); |
|||
}, |
|||
updatemylocation:function(needload){ |
|||
var that = this; |
|||
app.getLocation(function(res){ |
|||
var longitude = res.longitude; |
|||
var latitude = res.latitude; |
|||
app.post('ApiPeisong/updatemylocation',{longitude:longitude,latitude:latitude},function(){ |
|||
if(needload) that.getdata(); |
|||
}); |
|||
}); |
|||
}, |
|||
qiangdan: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
app.confirm('确定要接单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiPeisong/qiangdan', {id: id}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
setst: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var st = e.currentTarget.dataset.st; |
|||
if(st == 2){ |
|||
var tips = '确定改为已到店吗?'; |
|||
}if(st == 3){ |
|||
var tips = '确定改为已取货吗?'; |
|||
}if(st == 4){ |
|||
var tips = '确定改为已送达吗?'; |
|||
} |
|||
app.confirm(tips, function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiPeisong/setst', {id: id,st:st}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
openLocation:function(e){ |
|||
var latitude = parseFloat(e.currentTarget.dataset.latitude) |
|||
var longitude = parseFloat(e.currentTarget.dataset.longitude) |
|||
var address = e.currentTarget.dataset.address |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
daohang:function(e){ |
|||
var that = this; |
|||
var datainfo = that.psorder; |
|||
var binfo = that.binfo |
|||
var orderinfo = that.orderinfo |
|||
uni.showActionSheet({ |
|||
itemList: ['导航到商家', '导航到用户'], |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
if (res.tapIndex == 0) { |
|||
var longitude = datainfo.longitude |
|||
var latitude = datainfo.latitude |
|||
var name = binfo.name |
|||
var address = binfo.address |
|||
}else{ |
|||
var longitude = datainfo.longitude2 |
|||
var latitude = datainfo.latitude2 |
|||
var name = orderinfo.address |
|||
var address = orderinfo.address |
|||
} |
|||
console.log(longitude); |
|||
console.log(latitude); |
|||
console.log(address); |
|||
uni.openLocation({ |
|||
latitude:parseFloat(latitude), |
|||
longitude:parseFloat(longitude), |
|||
name:name, |
|||
address:address, |
|||
scale: 13 |
|||
}) |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
call:function(e){ |
|||
var tel = e.currentTarget.dataset.tel; |
|||
uni.makePhoneCall({ |
|||
phoneNumber: tel |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
|
|||
.map{width:100%;height:500rpx;overflow:hidden} |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.order-box{ width: 94%;margin:20rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f5f5f5 solid; height:88rpx; line-height:88rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#222222} |
|||
.order-box .head .f1 .img{width:24rpx;height:24rpx;margin-right:4px} |
|||
.order-box .head .f1 .t1{color:#06A051;margin-right:10rpx} |
|||
.order-box .head .f2{color:#FF6F30} |
|||
.order-box .head .f2 .t1{font-size:36rpx;margin-right:4rpx} |
|||
|
|||
.order-box .content{display:flex;justify-content:space-between;width: 100%; padding:16rpx 0px;border-bottom: 1px solid #f5f5f5;position:relative} |
|||
.order-box .content .f1{width:100rpx;display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t1 .x2{color:#999999;font-size:24rpx;margin-bottom:8rpx} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx; margin: 10rpx 0;} |
|||
|
|||
.order-box .content .f1 .t3{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t3 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx; margin: 10rpx 0;} |
|||
.order-box .content .f2{padding:0 10rpx;} |
|||
.order-box .content .f2 .t1{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-bottom:6rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f2 .t2{font-size:28rpx;color:#222222;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;} |
|||
.order-box .content .f2 .t3{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-top:30rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f3 .img{width:72rpx;height:168rpx} |
|||
|
|||
.orderinfo{width: 94%;margin:20rpx 3%;margin-top:10rpx;padding: 14rpx 3%;background: #FFF;border-radius:8px} |
|||
.orderinfo .box-title{color:#161616;font-size:30rpx;height:80rpx;line-height:80rpx;font-weight:bold} |
|||
.orderinfo .item{display:flex;width:100%;padding:10rpx 0;} |
|||
.orderinfo .item .t1{width:200rpx;color:#161616} |
|||
.orderinfo .item .t2{flex:1;text-align:right;color:#222222} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;background: #fff; position: fixed; bottom: 0px;left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
.bottom .f1{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55;border-right:1px solid #EAEEED} |
|||
.bottom .f1 .img{width:44rpx;height:44rpx} |
|||
.bottom .f2{width:188rpx;display:flex;align-items:center;flex-direction:column;font-size:20rpx;color:#373C55} |
|||
.bottom .f2 .img{width:44rpx;height:44rpx} |
|||
.bottom .btn1{flex:1;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%);height:100rpx;line-height:100rpx;color:#fff;text-align:center;font-size:32rpx} |
|||
</style> |
|||
@ -0,0 +1,330 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view> |
|||
<view class="search-container"> |
|||
<view class="search-box"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/search_ico.png'"></image> |
|||
<input class="search-text" placeholder="搜索商家" placeholder-style="color:#aaa;font-size:24rpx" @confirm="searchConfirm"/> |
|||
</view> |
|||
</view> |
|||
<block v-for="(item, index) in datalist" :key="item.id"> |
|||
<view class="order-box" @tap="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<view class="f1" v-if="item.status==4"><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/>已送达</view> |
|||
<view class="f1" v-else-if="item.leftminute>0"><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img"/><text class="t1">{{item.leftminute}}分钟内</text> 送达</view> |
|||
<view class="f1" v-else><image :src="event_rul +'/static/img/static/peisong/ps_time.png'" class="img'"/>已超时<text class="t1" style="margin-left:10rpx">{{-item.leftminute}}分钟</text></view> |
|||
<view class="flex1"></view> |
|||
<view class="f2"><text class="t1">{{item.ticheng}}</text>元</view> |
|||
</view> |
|||
<view class="content"> |
|||
<view class="f1"> |
|||
<view class="t1"><text class="x1">{{item.juli}}</text><text class="x2">{{item.juli_unit}}</text></view> |
|||
<view class="t2"><image :src="event_rul +'/static/img/static/peisong/ps_juli.png'" class="img"/></view> |
|||
<view class="t3"><text class="x1">{{item.juli2}}</text><text class="x2">{{item.juli2_unit}}</text></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="t1">{{item.binfo.name}}</view> |
|||
<view class="t2">{{item.binfo.address}}</view> |
|||
<view class="t3">{{item.orderinfo.address}}</view> |
|||
<view class="t2">{{item.orderinfo.area}}</view> |
|||
</view> |
|||
<view class="f3" @tap.stop="daohang" :data-index="index"><image :src="event_rul +'/static/img/static/peisong/ps_daohang.png'" class="img"/></view> |
|||
</view> |
|||
<view class="op"> |
|||
<view class="t1" v-if="item.status==1">已接单,正在赶往商家</view> |
|||
<view class="t1" v-if="item.status==2">已到店,等待取货</view> |
|||
<view class="t1" v-if="item.status==3">已取货,正在配送中</view> |
|||
<view class="t1" v-if="item.status==4">已送达,共用时{{item.useminute}}分钟,配送用时{{item.useminute2}}分钟</view> |
|||
<view class="flex1"></view> |
|||
<view class="btn1" @tap.stop="setst" :data-id="item.id" data-st="2" v-if="item.status==1">我已到店</view> |
|||
<view class="btn1" @tap.stop="setst" :data-id="item.id" data-st="3" v-if="item.status==2">我已取货</view> |
|||
<view class="btn1" @tap.stop="setst" :data-id="item.id" data-st="4" v-if="item.status==3">我已送达</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<!-- <view style="width:100%;height:120rpx"></view> --> |
|||
<!-- <view class="bottom"> |
|||
<view class="my"> |
|||
<image :src="event_rul +'/static/img/static/img/my.png'" class="img"/> |
|||
<text>我的</text> |
|||
</view> |
|||
<view class="btn1" @tap="setpsst" data-st="1" v-if="psuser.status==0">暂停接单中</view> |
|||
<view class="btn2" :style="{background:t('color1')}" @tap="setpsst" data-st="0" v-if="psuser.status==1">开启接单中</view> |
|||
</view> --> |
|||
|
|||
<view class="tabbar"> |
|||
<view class="tabbar-bot"></view> |
|||
<view class="tabbar-bar" style="background-color:#ffffff"> |
|||
<view @tap="goto" data-url="dating" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/home.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">大厅</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul + '/static/img/static/peisong/order'+(st!=4?'2':'')+'.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text" :class="st!=4?'active':''">订单</view> |
|||
</view> |
|||
<view @tap="goto" data-url="orderlist?st=4" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul + '/static/img/static/peisong/orderwc'+(st==4?'2':'')+'.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text" :class="st==4?'active':''">已完成</view> |
|||
</view> |
|||
<view @tap="goto" data-url="my" data-opentype="reLaunch" class="tabbar-item"> |
|||
<view class="tabbar-image-box"> |
|||
<image class="tabbar-icon" :src="event_rul +'/static/img/static/peisong/my.png'"></image> |
|||
</view> |
|||
<view class="tabbar-text">我的</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
<view style="display:none">{{timestamp}}</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: '11', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
keyword:'', |
|||
interval1:null, |
|||
timestamp:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st || '11'; |
|||
this.getdata(); |
|||
}, |
|||
onUnload:function(){ |
|||
clearInterval(this.interval1); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var st = that.st; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiPeisong/orderlist', {st: st,pagenum: pagenum,keyword:keyword}, function (res) { |
|||
that.loading = false; |
|||
if(res.status==0){ |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
that.nowtime = res.nowtime |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
that.updatemylocation(); |
|||
clearInterval(that.interval1); |
|||
that.interval1 = setInterval(function(){ |
|||
that.updatemylocation(true); |
|||
that.nowtime = that.nowtime + 10; |
|||
},10000) |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
updatemylocation:function(){ |
|||
var that = this; |
|||
console.log('updatemylocation'); |
|||
app.getLocation(function(res){ |
|||
var longitude = res.longitude; |
|||
var latitude = res.latitude; |
|||
var datalist = that.datalist; |
|||
for(var i in datalist){ |
|||
var thisdata = datalist[i]; |
|||
var rs = that.getdistance(thisdata.longitude2,thisdata.latitude2,longitude,latitude,1); |
|||
thisdata.juli2 = rs.juli; |
|||
thisdata.juli2_unit = rs.unit; |
|||
thisdata.leftminute = parseInt((thisdata.yujitime - that.nowtime) / 60); |
|||
datalist[i] = thisdata; |
|||
} |
|||
that.datalist = datalist; |
|||
that.timestamp = parseInt((new Date().getTime())/1000); |
|||
app.get('ApiPeisong/updatemylocation',{longitude:longitude,latitude:latitude,t:that.timestamp},function(){ |
|||
// if(needload) that.getdata(); |
|||
}); |
|||
}); |
|||
}, |
|||
getdistance: function (lng1, lat1, lng2, lat2) { |
|||
if(!lat1 || !lng1 || !lat2 || !lng2) return ''; |
|||
var rad1 = lat1 * Math.PI / 180.0; |
|||
var rad2 = lat2 * Math.PI / 180.0; |
|||
var a = rad1 - rad2; |
|||
var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0; |
|||
var r = 6378137; |
|||
var juli = r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) * Math.pow(Math.sin(b / 2), 2))); |
|||
var unit = 'm'; |
|||
if(juli> 1000){ |
|||
juli = juli/1000; |
|||
unit = 'km'; |
|||
} |
|||
juli = juli.toFixed(1); |
|||
return {juli:juli,unit:unit} |
|||
}, |
|||
setst: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var st = e.currentTarget.dataset.st; |
|||
if(st == 2){ |
|||
var tips = '确定改为已到店吗?'; |
|||
}if(st == 3){ |
|||
var tips = '确定改为已取货吗?'; |
|||
}if(st == 4){ |
|||
var tips = '确定改为已送达吗?'; |
|||
} |
|||
app.confirm(tips, function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiPeisong/setst', {id: id,st:st}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
daohang:function(e){ |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
var datainfo = that.datalist[index]; |
|||
uni.showActionSheet({ |
|||
itemList: ['导航到商家', '导航到用户'], |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
if (res.tapIndex == 0) { |
|||
var longitude = datainfo.longitude |
|||
var latitude = datainfo.latitude |
|||
var name = datainfo.binfo.name |
|||
var address = datainfo.binfo.address |
|||
}else{ |
|||
var longitude = datainfo.longitude2 |
|||
var latitude = datainfo.latitude2 |
|||
var name = datainfo.orderinfo.address |
|||
var address = datainfo.orderinfo.address |
|||
} |
|||
uni.openLocation({ |
|||
latitude:parseFloat(latitude), |
|||
longitude:parseFloat(longitude), |
|||
name:name, |
|||
address:address, |
|||
scale: 13, |
|||
success: function () { |
|||
console.log('success'); |
|||
}, |
|||
fail:function(res){ |
|||
console.log(res); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.getdata(); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
@import "./common.css"; |
|||
.container{ width:100%;display:flex;flex-direction:column} |
|||
.search-container {width: 100%;height:100rpx;padding: 20rpx 23rpx 20rpx 23rpx;background-color: #fff;position: relative;overflow: hidden;border-bottom:1px solid #f5f5f5} |
|||
.search-box {display:flex;align-items:center;height:60rpx;border-radius:30rpx;border:0;background-color:#f7f7f7;flex:1} |
|||
.search-box .img{width:24rpx;height:24rpx;margin-right:10rpx;margin-left:30rpx} |
|||
.search-box .search-text {font-size:24rpx;color:#222;width: 100%;} |
|||
|
|||
.order-box{ width: 94%;margin:20rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f5f5f5 solid; height:88rpx; line-height:88rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#222222} |
|||
.order-box .head .f1 .img{width:24rpx;height:24rpx;margin-right:4px} |
|||
.order-box .head .f1 .t1{color:#06A051;margin-right:10rpx} |
|||
.order-box .head .f2{color:#FF6F30} |
|||
.order-box .head .f2 .t1{font-size:36rpx;margin-right:4rpx} |
|||
|
|||
.order-box .content{display:flex;justify-content:space-between;width: 100%; padding:16rpx 0px;border-bottom: 1px solid #f5f5f5;position:relative} |
|||
.order-box .content .f1{width:100rpx;display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t1 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t1 .x2{color:#999999;font-size:24rpx;margin-bottom:8rpx} |
|||
.order-box .content .f1 .t2 .img{width:12rpx;height:36rpx; margin: 10rpx 0;} |
|||
|
|||
.order-box .content .f1 .t3{display:flex;flex-direction:column;align-items:center} |
|||
.order-box .content .f1 .t3 .x1{color:#FF6F30;font-size:28rpx;font-weight:bold} |
|||
.order-box .content .f1 .t3 .x2{color:#999999;font-size:24rpx} |
|||
.order-box .content .f2{flex:1;padding:0 20rpx} |
|||
.order-box .content .f2 .t1{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-bottom:6rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f2 .t2{font-size:28rpx;color:#222222;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;} |
|||
.order-box .content .f2 .t3{font-size:36rpx;color:#222222;font-weight:bold;line-height:50rpx;margin-top:30rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .f3 .img{width:72rpx;height:168rpx} |
|||
|
|||
.order-box .op{display:flex;justify-content:flex-end;align-items:center;width:100%; padding:20rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op .t1{color:#06A051;font-weight:bold} |
|||
.order-box .op .btn1{width:200rpx;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%);;height:88rpx;line-height:88rpx;color:#fff;border-radius:10rpx;text-align:center;font-size:32rpx} |
|||
|
|||
</style> |
|||
@ -0,0 +1,73 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<input type="text" class="input" placeholder="请输入支付宝账号" placeholder-style="color:#BBBBBB;font-size:28rpx" name="aliaccount" value=""></input> |
|||
</view> |
|||
</view> |
|||
<button class="set-btn" form-type="submit" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">保 存</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
textset:{}, |
|||
haspwd: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.loaded(); |
|||
//this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
//this.getdata(); |
|||
}, |
|||
methods: { |
|||
formSubmit: function (e) { |
|||
var formdata = e.detail.value; |
|||
var aliaccount = formdata.aliaccount |
|||
if (aliaccount == '') { |
|||
app.alert('请输入支付宝账号');return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post("ApiMy/setfield", {aliaccount:aliaccount}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form{ width:94%;margin:20rpx 3%;border-radius:5px;padding:20rpx 20rpx;padding: 0 3%;background: #FFF;} |
|||
.form-item{display:flex;align-items:center;width:100%;border-bottom: 1px #ededed solid;height:98rpx;line-height:98rpx;} |
|||
.form-item:last-child{border:0} |
|||
.form-item .label{color: #000;width:200rpx;} |
|||
.form-item .input{flex:1;color: #000;} |
|||
.set-btn{width: 90%;margin:60rpx 5%;height:96rpx;line-height:96rpx;border-radius:48rpx;color:#FFFFFF;font-weight:bold;} |
|||
</style> |
|||
@ -0,0 +1,159 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">微信号</text> |
|||
<input type="text" class="input" placeholder="请输入微信号" placeholder-style="color:#BBBBBB;font-size:28rpx" name="weixin" :value="userinfo.weixin"/> |
|||
</view> |
|||
</view> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">支付宝账号</text> |
|||
<input type="text" class="input" placeholder="请输入支付宝账号" placeholder-style="color:#BBBBBB;font-size:28rpx" name="aliaccount" :value="userinfo.aliaccount"/> |
|||
</view> |
|||
</view> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">开户行</text> |
|||
<picker class="picker" mode="selector" name="bankname" value="0" :range="banklist" @change="bindBanknameChange"> |
|||
<view v-if="bankname">{{bankname}}</view> |
|||
<view v-else>请选择开户行</view> |
|||
</picker> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">持卡人姓名</text> |
|||
<input type="text" class="input" placeholder="请输入持卡人姓名" name="bankcarduser" :value="userinfo.bankcarduser" placeholder-style="color:#BBBBBB;font-size:28rpx"/> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">银行卡号</text> |
|||
<input type="text" class="input" placeholder="请输入银行卡号" name="bankcardnum" :value="userinfo.bankcardnum" placeholder-style="color:#BBBBBB;font-size:28rpx"/> |
|||
</view> |
|||
</view> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<text class="label">短信验证码</text> |
|||
<input type="text" class="input" placeholder="请输入短信验证码" placeholder-style="color:#BBBBBB;font-size:28rpx" name="code" value=""/> |
|||
<view class="code" @tap="smscode">{{smsdjs||'获取验证码'}}</view> |
|||
</view> |
|||
</view> |
|||
<button class="set-btn" form-type="submit">保 存</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
smsdjs:'', |
|||
banklist: ['工商银行', '农业银行', '中国银行', '建设银行', '招商银行', '邮储银行', '交通银行', '浦发银行', '民生银行', '兴业银行', '平安银行', '中信银行', '华夏银行', '广发银行', '光大银行', '北京银行', '宁波银行'], |
|||
bankname: '', |
|||
userinfo:{}, |
|||
textset:{}, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.isload = true |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiPeisong/set', {}, function (data) { |
|||
that.loading = false; |
|||
that.userinfo = data.userinfo; |
|||
that.bankname = data.userinfo.bankname; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var formdata = e.detail.value; |
|||
var bankname = this.bankname |
|||
var bankcarduser = formdata.bankcarduser |
|||
var bankcardnum = formdata.bankcardnum |
|||
var weixin = formdata.weixin |
|||
var aliaccount = formdata.aliaccount |
|||
var code = formdata.code || '' |
|||
if (bankname == '') { |
|||
app.alert('请选择开户行');return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post("ApiPeisong/set", {bankname:bankname,bankcarduser:bankcarduser,bankcardnum:bankcardnum,weixin:weixin,aliaccount:aliaccount,code:code}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
}, |
|||
bindBanknameChange: function (e) { |
|||
this.bankname = this.banklist[e.detail.value]; |
|||
}, |
|||
smscode: function () { |
|||
var that = this; |
|||
if (that.hqing == 1) return; |
|||
that.hqing = 1; |
|||
var tel = that.userinfo.tel; |
|||
if (tel == '') { |
|||
app.alert('请输入手机号码'); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
if (!/^1[3456789]\d{9}$/.test(tel)) { |
|||
app.alert("手机号码有误,请重填"); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
app.post("ApiIndex/sendsms", {tel: tel}, function (data) { |
|||
if (data.status != 1) { |
|||
app.alert(data.msg); |
|||
} |
|||
}); |
|||
var time = 120; |
|||
var interval1 = setInterval(function () { |
|||
time--; |
|||
if (time < 0) { |
|||
that.smsdjs = '重新获取'; |
|||
that.hqing = 0; |
|||
clearInterval(interval1); |
|||
} else if (time >= 0) { |
|||
that.smsdjs = time + '秒'; |
|||
} |
|||
}, 1000); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form{ width:94%;margin:20rpx 3%;border-radius:5px;padding:20rpx 20rpx;padding: 0 3%;background: #FFF;} |
|||
.form-item{display:flex;align-items:center;width:100%;border-bottom: 1px #ededed solid;height:98rpx;line-height:98rpx;} |
|||
.form-item:last-child{border:0} |
|||
.form-item .label{color: #000;width:200rpx;} |
|||
.form-item .input{flex:1;color: #000;} |
|||
.form-item .picker{height: 60rpx;line-height:60rpx;margin-left: 0;flex:1;color: #000;} |
|||
.form-item .code{color:#06A051} |
|||
.set-btn{width: 90%;margin:60rpx 5%;height:96rpx;line-height:96rpx;border-radius:48rpx;color:#FFFFFF;font-weight:bold;background:linear-gradient(-90deg, #06A051 0%, #03B269 100%)} |
|||
</style> |
|||
@ -0,0 +1,72 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
<view class="form"> |
|||
<view class="form-item"> |
|||
<input type="text" class="input" placeholder="请输入微信号" placeholder-style="color:#BBBBBB;font-size:28rpx" name="weixin" value=""></input> |
|||
</view> |
|||
</view> |
|||
<button class="set-btn" form-type="submit" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">保 存</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
textset:{}, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.loaded(); |
|||
//this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
//this.getdata(); |
|||
}, |
|||
methods: { |
|||
formSubmit: function (e) { |
|||
var formdata = e.detail.value; |
|||
var weixin = formdata.weixin |
|||
if (weixin == '') { |
|||
app.alert('请输入微信号');return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post("ApiMy/setfield", {weixin:weixin}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form{ width:94%;margin:20rpx 3%;border-radius:5px;padding:20rpx 20rpx;padding: 0 3%;background: #FFF;} |
|||
.form-item{display:flex;align-items:center;width:100%;border-bottom: 1px #ededed solid;height:98rpx;line-height:98rpx;} |
|||
.form-item:last-child{border:0} |
|||
.form-item .label{color: #000;width:200rpx;} |
|||
.form-item .input{flex:1;color: #000;} |
|||
.set-btn{width: 90%;margin:60rpx 5%;height:96rpx;line-height:96rpx;border-radius:48rpx;color:#FFFFFF;font-weight:bold;} |
|||
</style> |
|||
@ -0,0 +1,192 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="mymoney" :style="{background:'#06A051'}"> |
|||
<view class="f1">可提现余额</view> |
|||
<view class="f2"><text style="font-size:26rpx">¥</text>{{userinfo.money}}</view> |
|||
<view class="f3" @tap="goto" data-url="moneylog?st=2"><text>提现记录</text><text class="iconfont iconjiantou" style="font-size:20rpx"></text></view> |
|||
</view> |
|||
<view class="content2"> |
|||
<view class="item2"><view class="f1">提现金额(元)</view></view> |
|||
<view class="item3"><view class="f1">¥</view><view class="f2"><input class="input" type="digit" name="money" value="" placeholder="请输入提现金额" placeholder-style="color:#999;font-size:40rpx" @input="moneyinput"/></view></view> |
|||
<view class="item4" v-if="sysset.withdrawfee>0 || sysset.withdrawmin>0"> |
|||
<text v-if="sysset.withdrawmin>0" style="margin-right:10rpx">最低提现金额{{sysset.withdrawmin}}元 </text> |
|||
<text v-if="sysset.withdrawfee>0">提现手续费{{sysset.withdrawfee}}% </text> |
|||
</view> |
|||
</view> |
|||
<view class="withdrawtype"> |
|||
<view class="f1">选择提现方式:</view> |
|||
<view class="f2"> |
|||
<view class="item" v-if="sysset.withdraw_weixin==1" @tap.stop="changeradio" data-paytype="微信钱包"> |
|||
<view class="t1"><image class="img" :src="event_rul +'/static/img/static/img/withdraw-weixin.png'"/>微信钱包</view> |
|||
<view class="radio" :style="paytype=='微信钱包' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
<label class="item" v-if="sysset.withdraw_aliaccount==1" @tap.stop="changeradio" data-paytype="支付宝"> |
|||
<view class="t1"><image class="img" :src="event_rul +'/static/img/static/img/withdraw-alipay.png'"/>支付宝</view> |
|||
<view class="radio" :style="paytype=='支付宝' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</label> |
|||
<label class="item" v-if="sysset.withdraw_bankcard==1" @tap.stop="changeradio" data-paytype="银行卡"> |
|||
<view class="t1"><image class="img" :src="event_rul +'/static/img/static/img/withdraw-cash.png'"/>银行卡</view> |
|||
<view class="radio" :style="paytype=='银行卡' ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</label> |
|||
</view> |
|||
</view> |
|||
<button class="btn" form-type="submit" :style="{background:'#06A051'}">立即提现</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
userinfo: [], |
|||
sysset: false, |
|||
paytype: '微信钱包', |
|||
show: 0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onShow: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiPeisong/withdraw', {}, function (res) { |
|||
that.loading = false; |
|||
that.userinfo = res.userinfo; |
|||
that.sysset = res.sysset; |
|||
var sysset = res.sysset; |
|||
var paytype = '微信钱包'; |
|||
if (sysset.withdraw_weixin == 1) { |
|||
paytype = '微信钱包'; |
|||
} |
|||
if (!sysset.withdraw_weixin || sysset.withdraw_weixin == 0) { |
|||
paytype = '支付宝'; |
|||
} |
|||
if ((!sysset.withdraw_weixin || sysset.withdraw_weixin == 0) && (!sysset.withdraw_aliaccount || sysset.withdraw_aliaccount == 0)) { |
|||
paytype = '银行卡'; |
|||
} |
|||
that.paytype = paytype; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
moneyinput: function (e) { |
|||
var usermoney = parseFloat(this.userinfo.money); |
|||
var money = parseFloat(e.detail.value); |
|||
if (money < 0) { |
|||
app.error('必须大于0'); |
|||
} else if (money > usermoney) { |
|||
app.error('可提现' + this.t('余额') + '不足'); |
|||
} |
|||
}, |
|||
changeradio: function (e) { |
|||
var that = this; |
|||
var paytype = e.currentTarget.dataset.paytype; |
|||
that.paytype = paytype; |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
console.log(e.detail.value) |
|||
var usermoney = parseFloat(this.userinfo.money); |
|||
var withdrawmin = parseFloat(this.sysset.withdrawmin); //var formdata = e.detail.value; |
|||
var money = parseFloat(e.detail.value.money); |
|||
var paytype = this.paytype; |
|||
if (isNaN(money) || money <= 0) { |
|||
app.error('提现金额必须大于0'); |
|||
return; |
|||
} |
|||
if (withdrawmin > 0 && money < withdrawmin) { |
|||
app.error('提现金额必须大于¥' + withdrawmin); |
|||
return; |
|||
} |
|||
if (money > usermoney) { |
|||
app.error('余额不足'); |
|||
return; |
|||
} |
|||
if (paytype == '支付宝' && !this.userinfo.aliaccount) { |
|||
app.alert('请先设置支付宝账号', function () { |
|||
app.goto('setinfo'); |
|||
}); |
|||
return; |
|||
} |
|||
if (paytype == '银行卡' && (!this.userinfo.bankname || !this.userinfo.bankcarduser || !this.userinfo.bankcardnum)) { |
|||
app.alert('请先设置完整银行卡信息', function () { |
|||
app.goto('setinfo'); |
|||
}); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiPeisong/withdraw', {money: money,paytype: paytype}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} else { |
|||
app.success(res.msg); |
|||
that.subscribeMessage(function () { |
|||
setTimeout(function () { |
|||
app.goto('my'); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{display:flex;flex-direction:column} |
|||
.mymoney{width:94%;margin:20rpx 3%;border-radius: 10rpx 56rpx 10rpx 10rpx;position:relative;display:flex;flex-direction:column;padding:70rpx 0} |
|||
.mymoney .f1{margin:0 0 0 60rpx;color:rgba(255,255,255,0.8);font-size:24rpx;} |
|||
.mymoney .f2{margin:20rpx 0 0 60rpx;color:#fff;font-size:64rpx;font-weight:bold} |
|||
.mymoney .f3{height:56rpx;padding:0 10rpx 0 20rpx;border-radius: 28rpx 0px 0px 28rpx;background:rgba(255,255,255,0.2);font-size:20rpx;font-weight:bold;color:#fff;display:flex;align-items:center;position:absolute;top:94rpx;right:0} |
|||
|
|||
.content2{width:94%;margin:10rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;background:#fff} |
|||
.content2 .item1{display:flex;width:100%;border-bottom:1px solid #F0F0F0;padding:0 30rpx} |
|||
.content2 .item1 .f1{flex:1;font-size:32rpx;color:#333333;font-weight:bold;height:120rpx;line-height:120rpx} |
|||
.content2 .item1 .f2{color:#FC4343;font-size:44rpx;font-weight:bold;height:120rpx;line-height:120rpx} |
|||
|
|||
.content2 .item2{display:flex;width:100%;padding:0 30rpx;padding-top:10rpx} |
|||
.content2 .item2 .f1{height:80rpx;line-height:80rpx;color:#999999;font-size:28rpx} |
|||
|
|||
.content2 .item3{display:flex;width:100%;padding:0 30rpx;padding-bottom:20rpx} |
|||
.content2 .item3 .f1{height:100rpx;line-height:100rpx;font-size:60rpx;color:#333333;font-weight:bold;margin-right:20rpx} |
|||
.content2 .item3 .f2{display:flex;align-items:center;font-size:60rpx;color:#333333;font-weight:bold} |
|||
.content2 .item3 .f2 .input{font-size:60rpx;height:100rpx;line-height:100rpx;} |
|||
.content2 .item4{display:flex;width:94%;margin:0 3%;border-top:1px solid #F0F0F0;height:100rpx;line-height:100rpx;color:#8C8C8C;font-size:28rpx} |
|||
|
|||
.withdrawtype{width:94%;margin:20rpx 3%;border-radius:10rpx;display:flex;flex-direction:column;margin-top:20rpx;background:#fff} |
|||
.withdrawtype .f1{height:100rpx;line-height:100rpx;padding:0 30rpx;color:#333333;font-weight:bold} |
|||
|
|||
|
|||
.withdrawtype .f2{padding:0 30rpx} |
|||
.withdrawtype .f2 .item{border-bottom:1px solid #f5f5f5;height:100rpx;display:flex;align-items:center} |
|||
.withdrawtype .f2 .item:last-child{border-bottom:0} |
|||
.withdrawtype .f2 .item .t1{flex:1;display:flex;align-items:center;color:#333} |
|||
.withdrawtype .f2 .item .t1 .img{width:44rpx;height:44rpx;margin-right:40rpx} |
|||
|
|||
.withdrawtype .f2 .item .radio{flex-shrink:0;width: 36rpx;height: 36rpx;background: #FFFFFF;border: 3rpx solid #BFBFBF;border-radius: 50%;margin-right:10rpx} |
|||
.withdrawtype .f2 .item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.btn{ height:100rpx;line-height: 100rpx;width:90%;margin:0 auto;border-radius:50rpx;margin-top:30rpx;color: #fff;font-size: 30rpx;font-weight:bold} |
|||
</style> |
|||
@ -0,0 +1,593 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul +'/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}} <text v-if="address.company">{{address.company}}</text></view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
|
|||
<view class="buydata"> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex" v-for="(item,index) in prolist"> |
|||
<view class="img"><image class="img" :src="item.pic"/></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{item.name}}</view> |
|||
<view class="f2">市场价: ¥{{item.sell_price}}</view> |
|||
<view class="f3" :style="{color:t('color1')}">{{item.score_price}}{{t('积分')}}<text v-if="item.money_price>0">+{{item.money_price}}元</text><text style="padding-left:10rpx"> × {{item.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice*1 > product_price*1">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price" v-if="freight_price*1 > 0"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freightList[freightkey].freight_price}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
<view style="width:100%;height:110rpx;"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="f1 flex1">总计: |
|||
<text class="txt" :style="{color:t('color1')}" v-if="totalprice*1 > 0">¥{{totalprice}} + {{totalscore}}{{t('积分')}}</text> |
|||
<text class="txt" :style="{color:t('color1')}" v-else>{{totalscore}}{{t('积分')}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
prolist: [], |
|||
freightList: [], |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
totalmoney: 0, |
|||
totalscore: 0, |
|||
totalweight: 0, |
|||
totalnum: 1, |
|||
totalprice:'0.00', |
|||
storedata: [], |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
havetongcheng: "", |
|||
beizhu: "", |
|||
field1: "", |
|||
field2: "", |
|||
field3: "", |
|||
field4: "", |
|||
field5: "", |
|||
storeshowall:false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiScoreshop/buy', {prodata: that.opt.prodata}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg, function(){ |
|||
app.goback() |
|||
}); |
|||
return; |
|||
} |
|||
that.prolist = res.prolist; |
|||
that.freightList = res.freightList; |
|||
that.totalmoney = res.totalmoney; |
|||
that.totalscore = res.totalscore; |
|||
that.totalnum = res.totalnum; |
|||
that.totalweight = res.totalweight; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.address = res.address; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
for (var j in res.freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude) { |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
|
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
|
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value; |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value; |
|||
}, |
|||
inputBeizhu: function (e) { |
|||
this.beizhu = e.detail.value; |
|||
}, |
|||
inputfield1: function (e) { |
|||
this.field1 = e.detail.value; |
|||
}, |
|||
inputfield2: function (e) { |
|||
this.field2 = e.detail.value; |
|||
}, |
|||
inputfield3: function (e) { |
|||
this.field3 = e.detail.value; |
|||
}, |
|||
inputfield4: function (e) { |
|||
this.field4 = e.detail.value; |
|||
}, |
|||
inputfield5: function (e) { |
|||
this.field5 = e.detail.value; |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//改变收货地址 |
|||
changeAddress: function () { |
|||
var that = this; |
|||
that.onLoad(); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var totalnum = that.totalnum; |
|||
var totalmoney = that.totalmoney; |
|||
var totalweight = that.totalweight; |
|||
var address = that.address; |
|||
|
|||
var freightdata = that.freightList[that.freightkey]; |
|||
console.log(freightdata); |
|||
|
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress |
|||
var freight_price = freightdata.freight_price; |
|||
|
|||
that.freight_price = freight_price; |
|||
var totalprice = freight_price * 1 + totalmoney * 1 |
|||
that.totalprice = totalprice.toFixed(2); |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var prodata = this.opt.prodata; |
|||
var buytype = this.buytype; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var freight_time = that.freight_time; //console.log(yhqrecoid); return; |
|||
|
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
|
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiScoreshop/createOrder', {prodata: prodata,freightid: freightid,freight_time: freight_time,storeid: storeid,addressid: addressid,linkman: linkman,tel: tel,formdata:newformdata}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 0) { |
|||
app.error(res.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + res.payorderid); |
|||
}); |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:10rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .f1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .f1 .text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;font-size:30rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;font-size:30rpx;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,274 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<block v-if="cartlist.length>0"> |
|||
<view class="cartmain"> |
|||
<block v-for="(item, index) in cartlist" :key="item.id"> |
|||
<view class="item"> |
|||
<view class="content flex-y-center"> |
|||
<view @tap.stop="changeradio" :data-index="index" class="radio" :style="item.checked ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
<image :src="item.product.pic" class="img" @tap="gotoFun" :data-url="'/pages/shop/product?id=' + item.product.id"/> |
|||
<view class="detail"> |
|||
<view class="title"><text>{{item.product.name}}</text></view> |
|||
<view class="desc"><text>价值:¥{{item.product.sell_price}}</text></view> |
|||
<view class="buynum flex flex-y-center"> |
|||
<view class="price flex1" :style="{color:t('color1')}"><text v-if="item.product.money_price>0">¥{{item.product.money_price}}+</text>{{item.product.score_price}}{{t('积分')}}</view> |
|||
<view class="f2 flex flex-y-center"> |
|||
<view class="minus flex-x-center" @tap="gwcminus" :data-index="index" :data-cartid="item.id" :data-num="item.num">-</view> |
|||
<input class="flex-x-center" type="number" :value="item.num" @blur="gwcinput" :data-max="item.product.stock" :data-index="index" :data-cartid="item.id" :data-num="item.num"></input> |
|||
<view class="plus flex-x-center" @tap="gwcplus" :data-index="index" :data-max="item.product.stock" :data-num="item.num" :data-cartid="item.id">+</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="prodel" @tap="cartdelete" :data-cartid="item.id"><image :src="event_rul +'/static/img/static/img/del.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
|
|||
<view style="height:auto;position:relative"> |
|||
<view style="width:100%;height:110rpx"></view> |
|||
<view class="footer flex" :class="menuindex>-1?'tabbarbot':'notabbarbot'"> |
|||
<view class="text1">合计:</view> |
|||
<view class="text2" :style="{color:t('color1')}"><text v-if="totalmoney>0">¥{{totalmoney}}+</text><text>{{totalscore}}{{t('积分')}}</text></view> |
|||
<view class="flex1"></view> |
|||
<view class="op" @tap="toOrder" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">去结算</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</block> |
|||
<block v-else> |
|||
<view class="data-empty"> |
|||
<image :src="pre_url+'/static/img/cartnull.png'" class="data-empty-img" style="width:120rpx;height:120rpx"/> |
|||
<view class="data-empty-text" style="margin-top:20rpx;font-size:24rpx">购物车空空如也~</view> |
|||
<button style="width:400rpx;border:1px solid #ff6801;border-radius:6rpx;background:#ff6801;margin-top:20px;color:#fff" @tap="goto" data-url="index">去选购</button> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
initdata:{}, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
cartlist:[], |
|||
totalscore:0, |
|||
totalmoney: '0.00', |
|||
selectedcount: 0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
}, |
|||
onShow:function(){ |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function (){ |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiScoreshop/cart', {}, function (res) { |
|||
that.loading = false; |
|||
that.cartlist = res.cartlist; |
|||
var cartlist = res.cartlist; |
|||
for (var i in cartlist) { |
|||
cartlist[i].checked = true; |
|||
} |
|||
that.calculate(); |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
changeradio: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
var cartlist = that.cartlist; |
|||
var checked = cartlist[index].checked; |
|||
if(checked){ |
|||
cartlist[index].checked = false; |
|||
}else{ |
|||
cartlist[index].checked = true; |
|||
} |
|||
that.cartlist = cartlist; |
|||
that.calculate(); |
|||
}, |
|||
calculate: function () { |
|||
var that = this; |
|||
var cartlist = that.cartlist; |
|||
var totalmoney = 0.00; |
|||
var totalscore = 0.00; |
|||
var selectedcount = 0; |
|||
for (var i in cartlist) { |
|||
if (cartlist[i].checked) { |
|||
var thiscart = cartlist[i]; |
|||
totalmoney += thiscart.product.money_price * thiscart.num; |
|||
totalscore += thiscart.product.score_price * thiscart.num; |
|||
selectedcount += thiscart.num; |
|||
} |
|||
} |
|||
that.totalmoney = totalmoney.toFixed(2); |
|||
that.totalscore = totalscore; |
|||
that.selectedcount = selectedcount; |
|||
}, |
|||
checkpro: function (e) { |
|||
var that = this; |
|||
var ids = e.detail.value; |
|||
that.ids = ids; |
|||
that.calculate(); |
|||
}, |
|||
cartdelete: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.cartid; |
|||
app.confirm('确定要从购物车移除吗?', function () { |
|||
app.post('ApiScoreshop/cartdelete', {id: id}, function (data) { |
|||
app.success('操作成功'); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toOrder: function () { |
|||
var that = this; |
|||
var cartlist = that.cartlist; |
|||
var prodata = []; |
|||
for (var i in cartlist) { |
|||
if (cartlist[i].checked) { |
|||
prodata.push(cartlist[i].proid + ',' + cartlist[i].num); |
|||
} |
|||
} |
|||
if (prodata.length == 0) { |
|||
app.error('请先选择产品'); |
|||
return; |
|||
} |
|||
app.goto('buy?prodata=' + prodata.join('-')); |
|||
}, |
|||
//加 |
|||
gwcplus: function (e) { |
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
var maxnum = parseInt(e.currentTarget.dataset.max); |
|||
var cartid = e.currentTarget.dataset.cartid; |
|||
var num = parseInt(e.currentTarget.dataset.num); |
|||
if (num >= maxnum) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
var cartlist = this.cartlist; |
|||
cartlist[index].num++; |
|||
this.cartlist = cartlist |
|||
this.calculate(); |
|||
var that = this; |
|||
app.post('ApiScoreshop/cartChangenum', {id: cartid,num: num + 1}, function (data) { |
|||
if (data.status == 1) { |
|||
//that.getdata(); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
}, |
|||
//减 |
|||
gwcminus: function (e) { |
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
var maxnum = parseInt(e.currentTarget.dataset.max); |
|||
var cartid = e.currentTarget.dataset.cartid; |
|||
var num = parseInt(e.currentTarget.dataset.num); |
|||
if (num == 1) return; |
|||
var cartlist = this.cartlist; |
|||
cartlist[index].num--; |
|||
this.cartlist = cartlist |
|||
this.calculate(); |
|||
var that = this; |
|||
app.post('ApiScoreshop/cartChangenum', {id: cartid,num: num - 1}, function (data) { |
|||
if (data.status == 1) { |
|||
//that.getdata(); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
}, |
|||
//输入 |
|||
gwcinput: function (e) { |
|||
var index = parseInt(e.currentTarget.dataset.index); |
|||
var maxnum = parseInt(e.currentTarget.dataset.max); |
|||
var cartid = e.currentTarget.dataset.cartid; |
|||
var num = e.currentTarget.dataset.num; |
|||
var newnum = parseInt(e.detail.value); |
|||
console.log(num + '--' + newnum); |
|||
if (num == newnum) return; |
|||
|
|||
if (newnum > maxnum) { |
|||
app.error('库存不足'); |
|||
return; |
|||
} |
|||
var cartlist = this.cartlist; |
|||
cartlist[index].num = newnum; |
|||
this.cartlist = cartlist |
|||
this.calculate(); |
|||
|
|||
var that = this; |
|||
app.post('ApiScoreshop/cartChangenum', {id: cartid,num: newnum}, function (data) { |
|||
if (data.status == 1) { |
|||
//that.getdata(); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
}, |
|||
addcart:function(){ |
|||
this.getdata(); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.cartmain .item {width: 94%;margin:20rpx 3%;background: #fff;border-radius:20rpx;padding:30rpx 3%;} |
|||
|
|||
.cartmain .item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cartmain .item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cartmain .item .content {width:100%;margin:0;position: relative;} |
|||
.cartmain .item .content .check {width:70rpx;margin-top: 30rpx;} |
|||
.cartmain .item .content .img {width: 140rpx;height: 140rpx;} |
|||
.cartmain .item .content .detail {flex:1;margin-left:16rpx} |
|||
.cartmain .item .content .detail .title {padding-right:40rpx;color: #222222;font-weight:bold;font-size:26rpx;line-height:34rpx;margin-bottom:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:68rpx} |
|||
.cartmain .item .content .detail .desc {height: 46rpx;line-height: 46rpx;color: #666;overflow: hidden;font-size: 24rpx;} |
|||
.cartmain .item .content .prodel{width:24rpx;height:24rpx;position:absolute;top:0;right:0} |
|||
.cartmain .item .content .prodel image{width:100%;height:100%} |
|||
|
|||
.cartmain .item .buynum .price{height: 46rpx;display:flex;align-items:center;font-size:26rpx;font-weight:bold} |
|||
.cartmain .item .buynum .f2{ border:1px solid #f1f1f1} |
|||
.cartmain .item .buynum .f2 input{flex:1;width:70rpx;border-left:1px solid #f1f1f1;border-right:1px solid #f1f1f1;text-align:center;color:#333;font-size:26rpx} |
|||
.cartmain .item .buynum .f2 .plus{width:50rpx;} |
|||
.cartmain .item .buynum .f2 .minus{width:50rpx;} |
|||
|
|||
.cartmain .item .bottom{width: 94%;margin: 0 3%;border-top: 1px #e5e5e5 solid;padding: 10rpx 0px;overflow: hidden;color: #ccc;display:flex;align-items:center;justify-content:flex-end} |
|||
.cartmain .item .bottom .f1{display:flex;align-items:center;color:#333} |
|||
.cartmain .item .bottom .f1 image{width:40rpx;height:40rpx;border-radius:4px;margin-right:4px} |
|||
.cartmain .item .bottom .op {border: 1px #ff4246 solid;border-radius: 10rpx;color: #ff4246;padding: 0 10rpx;height: 46rpx;line-height: 46rpx;margin-left: 10rpx;} |
|||
|
|||
.footer {width: 100%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;z-index:8;display:flex;align-items:center;padding:0 20rpx;border-top:1px solid #EFEFEF} |
|||
.footer .text0{color:#666666;font-size:24rpx;} |
|||
.footer .text1 {height: 110rpx;line-height: 110rpx;color:#444;font-weight:bold;font-size:24rpx;margin-right:10rpx} |
|||
.footer .text2 {color: #F64D00;font-size: 30rpx;font-weight:bold} |
|||
.footer .op{width: 216rpx;height: 80rpx;line-height:80rpx;border-radius: 6rpx;font-weight:bold;color:#fff;font-size:28rpx;text-align:center;margin-left:30rpx} |
|||
|
|||
.data-empty {width: 100%; text-align: center; padding-top:100rpx;padding-bottom:100rpx} |
|||
.data-empty-img{ width: 300rpx; height: 300rpx; display: inline-block; } |
|||
.data-empty-text{ display: block; text-align: center; color: #999999; font-size:32rpx; width: 100%; margin-top: 30rpx; } |
|||
</style> |
|||
@ -0,0 +1,194 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form-item1"> |
|||
<view class="label">商品信息</view> |
|||
<view class="product flex"> |
|||
<view class="img"><image :src="og.pic"></image></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{og.name}}</view> |
|||
<view class="f2">{{og.ggname}}</view> |
|||
<view class="f3">¥{{og.sell_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item2 flex flex-y-center"> |
|||
<view class="label">您的打分</view> |
|||
<view class="i-rate" @touchmove="handleTouchMove"> |
|||
<input type="text" name="score" :value="score" class="i-rate-hide-input"></input> |
|||
<view v-for="(item, index) in 5" :key="index" class="i-rate-star" :class="( index < score ? 'i-rate-current':'' )" :data-index="index" @tap="handleClick"> |
|||
<image v-if="index < score" :src="event_rul +'/static/img/static/img/star2.png'"></image> |
|||
<image v-else :src="event_rul +'/static/img/static/img/star.png'"></image> |
|||
</view> |
|||
<view class="i-rate-text"></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item3 flex-col"> |
|||
<view class="label">您的评价</view> |
|||
<textarea placeholder="输入您的评价内容" placeholder-style="color:#ccc;" name="content" :value="comment.content" style="height:200rpx" :disabled="comment.id?true:false"></textarea> |
|||
</view> |
|||
|
|||
<view class="form-item4 flex-col"> |
|||
<view class="label">上传图片</view> |
|||
<view id="content_picpreview" class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view v-for="(item, index) in content_pic" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="content_pic" v-if="!comment.id"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" bindtap="xuanzhuan" data-index="{{index}}" data-field="content_pic" wx:if="{{!comment.id}}"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="content_pic" v-if="!comment.id && content_pic.length<5"></view> |
|||
</view> |
|||
</view> |
|||
<button class="subbtn" form-type="submit" v-if="!comment.id">确定</button> |
|||
</form> |
|||
</block> |
|||
<loading v-show="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
og:{}, |
|||
comment:{}, |
|||
score: 0, |
|||
content_pic: [], |
|||
tempFilePaths: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var ogid = that.opt.ogid; |
|||
that.loading = true; |
|||
app.get('ApiOrder/comment', {ogid: ogid}, function (res) { |
|||
that.loading = false; |
|||
that.og = res.og; |
|||
if (res.comment){ |
|||
that.comment = res.comment; |
|||
that.score = res.comment.score; |
|||
var content_pic = res.comment.content_pic; |
|||
that.content_pic = content_pic.split(','); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var ogid = that.opt.ogid; |
|||
var score = e.detail.value.score; |
|||
var content = e.detail.value.content; |
|||
var content_pic = that.content_pic; |
|||
if (score == 0) { |
|||
app.error('请打分'); |
|||
return; |
|||
} |
|||
if (content == '') { |
|||
app.error('请填写评价内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiOrder/comment', {ogid: ogid,content: content,content_pic: content_pic.join(','),score: score}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 2000); |
|||
}); |
|||
}, |
|||
handleClick: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.score = index + 1; |
|||
}, |
|||
handleTouchMove: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var clientWidth = uni.getSystemInfoSync().windowWidth; |
|||
if (!e.changedTouches[0]) return; |
|||
var movePageX = e.changedTouches[0].pageX; |
|||
var space = movePageX - 150 / 750 * clientWidth; |
|||
if (space <= 0) return; |
|||
var starwidth = 60 / 750 * clientWidth; |
|||
var setIndex = Math.ceil(space / starwidth); |
|||
setIndex = setIndex > 5 ? 5 : setIndex; |
|||
this.setData({ |
|||
score: setIndex |
|||
}); |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pic') that.pic = pics; |
|||
if(field == 'pics') that.pics = pics; |
|||
if(field == 'zhengming') that.zhengming = pics; |
|||
},1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item1{ width:100%;background: #fff; padding: 8rpx 20rpx;} |
|||
.form-item1 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.product{ width: 100%; background: #fff; } |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f2{color: #a4a4a4; font-size:24rpx} |
|||
.product .info .f3{color: #ff0d51; font-size:28rpx} |
|||
.product image{ width:140rpx;height:140rpx} |
|||
|
|||
.form-item2{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item2 .label{ width:150rpx;height:60rpx;line-height:60rpx} |
|||
|
|||
.form-item3{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item3 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item3 textarea{width: 100%;border: 1px #dedede solid; border-radius: 10rpx; padding: 10rpx;height: 120rpx;} |
|||
|
|||
|
|||
.form-item4{width:100%;background: #fff; padding: 20rpx 20rpx;margin-top:1px} |
|||
.form-item4 .label{ width:150rpx;} |
|||
/*.form-item4 image{ width: 100rpx; height: 100rpx;background:#eee;margin-right:6rpx} |
|||
.form-item4 .imgbox{height:100rpx}*/ |
|||
|
|||
.subbtn{ width: 90%; margin: 0 5%;margin-top:40rpx; height: 40px; line-height: 40px; color: #fff; background: #e94745; } |
|||
|
|||
.i-rate{margin:0;padding:0;display:inline-block;vertical-align:middle;} |
|||
.i-rate-hide-input{display:none} |
|||
.i-rate-star{display:inline-block;color:#e9e9e9;padding:0 10rpx} |
|||
.i-rate-star image{width:50rpx;height:50rpx} |
|||
.i-rate-current{color:#f5a623} |
|||
.i-rate-text{display:inline-block;vertical-align:middle;margin-left:6px;font-size:14px} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,125 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="comment"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="item.headimg"/> |
|||
<view class="t2">{{item.nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (item.score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view style="color:#777;font-size:22rpx;">{{item.createtime}}</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="item.content_pic!=''"> |
|||
<block v-for="(itemp, index) in item.content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="item.content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" v-if="item.reply_content"> |
|||
<view class="arrow"></view> |
|||
<view class="t1">商家回复:{{item.reply_content}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata" text="暂无评价~"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiScoreshop/commentlist', {proid: that.opt.proid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{background:#fff} |
|||
.comment{display:flex;flex-direction:column;padding:10rpx 0;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{width:100%;padding:10rpx 0;position:relative} |
|||
.comment .item .f3 .arrow{width: 16rpx;height: 16rpx;background:#eee;transform: rotate(45deg);position:absolute;top:0rpx;left:36rpx} |
|||
.comment .item .f3 .t1{width:100%;border-radius:10rpx;padding:10rpx;font-size:22rpx;color:#888;background:#eee} |
|||
|
|||
</style> |
|||
@ -0,0 +1,231 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="topimg" :style="{background:t('color1')}"> |
|||
<image class="img" :src="pre_url+'/static/img/scoreshop_top.png'"/> |
|||
</view> |
|||
<view class="topinfo"> |
|||
<view class="flex"> |
|||
<view class="myscore"><text class="t1" :style="{color:t('color1')}">{{score}}</text><text class="t2">我的{{t('积分')}}</text></view> |
|||
<view class="scorelog" @tap="goto" data-url="/pages/my/scorelog" :style="{color:t('color1'),background:'rgba('+t('color1rgb')+',0.2)'}">{{t('积分')}}明细<text class="iconfont iconjiantou"></text></view> |
|||
<view class="orderlog" @tap="goto" data-url="orderlist">兑换记录<text class="iconfont iconjiantou"></text></view> |
|||
</view> |
|||
<view class="search-container"> |
|||
<view class="search-box"> |
|||
<image class="img" :src="pre_url +'/static/img/static/img/search_ico.png'"/> |
|||
<input :value="keyword" placeholder="商品搜索..." placeholder-style="font-size:24rpx;color:#C2C2C2" type="text" confirm-type="search" @confirm="search"></input> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<block v-if="clist.length > 0"> |
|||
<view class="navbox"> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<view style="cursor:pointer" @tap="goto" :data-url="item.url?item.url:'prolist?cid='+item.id" class="nav_li"> |
|||
<image class="img" :src="item.pic"/> |
|||
<view class="txt">{{item.name}}</view> |
|||
</view> |
|||
</block> |
|||
<view class="nav_li" @tap="goto" data-url="prolist"> |
|||
<image :src="pre_url + '/static/img/static/img/all.png'" class="img"/> |
|||
<view class="txt">全部</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
|
|||
<view id="datalist"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view @tap="goto" :data-url="'product?id=' + item.id" class="product-item"> |
|||
<view class="itemcontent"> |
|||
<view class="product-pic"> |
|||
<image :src="item.pic" class="img"/> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="p1">{{item.name}}</view> |
|||
<view class="p2"><block v-if="item.sell_price>0">价值{{item.sell_price}}元</block></view> |
|||
<view class="p3"> |
|||
<view class="t1 flex"> |
|||
<view class="x1" :style="{color:t('color1')}"> |
|||
<text style="font-size:13px"> |
|||
<block v-if="item.score_price>0">{{item.score_price}}{{t('积分')}}</block> |
|||
<block v-if="item.money_price>0"><block v-if="item.score_price>0">+</block>{{item.money_price}}元</block> |
|||
</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="itembottom"> |
|||
<view class="f1">已兑换<text :style="{color:t('color1')}"> {{item.sales}} </text>件</view> |
|||
<button class="f2" :style="{background:t('color1')}">立即兑换</button> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
score:0, |
|||
pics:[], |
|||
clist:[], |
|||
datalist: [], |
|||
pagenum: 1, |
|||
keyword: '', |
|||
nodata: false, |
|||
nomore: false, |
|||
sclist: "" |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdatalist(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.post('ApiScoreshop/index', {}, function (res) { |
|||
uni.stopPullDownRefresh(); |
|||
that.loading = false; |
|||
that.isload = true; |
|||
uni.setNavigationBarTitle({ |
|||
title: that.t('积分') + '商城' |
|||
}); |
|||
that.clist = res.clist; |
|||
that.pics = res.pics; |
|||
that.score = res.score; |
|||
that.loaded(); |
|||
}); |
|||
that.getdatalist(); |
|||
}, |
|||
getdatalist: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiScoreshop/getprolist', {pagenum: pagenum,keyword: keyword}, function (res) { |
|||
uni.stopPullDownRefresh(); |
|||
that.loading = false; |
|||
that.isload = true; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
search: function (e) { |
|||
var keyword = e.detail.value; |
|||
app.goto('prolist?keyword='+keyword); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.topimg{width:100%;height:300rpx;} |
|||
.topimg .img{width:100%;height:100%} |
|||
|
|||
.topinfo{width:94%;margin:0 3%;background:#fff;border-radius:16rpx;overflow:hidden;padding:60rpx 20rpx 20rpx 20rpx;margin-top:-100rpx;position:relative;display:flex;flex-direction:column} |
|||
.topinfo .myscore{margin-left:40rpx;display:flex;flex-direction:column} |
|||
.topinfo .myscore .t1{font-size:48rpx;font-weight:bold} |
|||
.topinfo .myscore .t2{color:#999999;font-size:24rpx;margin-top:10rpx} |
|||
.topinfo .scorelog{margin-left:120rpx;margin-top:30rpx;height:56rpx;line-height:56rpx;width:172rpx;text-align:center;border-radius:28rpx;font-size:24rpx;font-weight:bold;display:flex;justify-content:center;align-items:center} |
|||
.topinfo .orderlog{margin-left:40rpx;margin-top:30rpx;background:rgba(255, 160, 10, 0.2);height:56rpx;line-height:56rpx;width:172rpx;text-align:center;border-radius:28rpx;color:#FFA00A;font-size:24rpx;font-weight:bold;display:flex;justify-content:center;align-items:center} |
|||
.search-container {width: 100%;height: 94rpx;padding: 16rpx 23rpx 14rpx 23rpx;background-color: #fff;position: relative;overflow: hidden;margin-top:20rpx} |
|||
.search-box {display:flex;align-items:center;height:60rpx;border-radius:30rpx;border:0;background-color:#f7f7f7;flex:1} |
|||
.search-box .img{width:24rpx;height:24rpx;margin-right:10rpx;margin-left:30rpx} |
|||
.search-box .search-text {font-size:24rpx;color:#C2C2C2;width: 100%;} |
|||
|
|||
.navbox{width:94%;margin:0 3%;margin-top:20rpx;background: #fff;height: auto;overflow: hidden;padding-bottom: 0.1rpx;margin-bottom:12rpx} |
|||
.nav_li{width: 25%;text-align: center;box-sizing: border-box;padding:30rpx 0 10rpx;float: left;color:#333} |
|||
.nav_li .img{width:80rpx;height: 80rpx;margin-bottom:10rpx;} |
|||
|
|||
|
|||
|
|||
.weui-loadmore_line .weui-loadmore__tips{background-color:#f6f6f6} |
|||
.swiper-container {width: 100%;} |
|||
.swiper-container image {display: block;width: 100%;} |
|||
.category{width: 100%;padding-top: 20rpx;padding-bottom: 20rpx;flex-direction:row;white-space: nowrap; display:flex;background:#fff;overflow-x:scroll;margin-bottom:20rpx} |
|||
.category .item{width:150rpx;display: inline-block; text-align: center;} |
|||
.category .item image{width:80rpx;height:80rpx;margin: 0 auto;border-radius: 50%;} |
|||
.category .item .t1{display: block;color: #666;} |
|||
.product-item{display:flex;flex-direction:column;background: #fff; padding:0 20rpx;margin:0 20rpx;margin-bottom:20rpx;border-radius:20rpx} |
|||
.product-item .itemcontent{display:flex;height:220rpx;border-bottom:1px solid #E6E6E6;padding:20rpx 0} |
|||
.product-item .product-pic {width: 180rpx;height: 180rpx; background: #ffffff;overflow:hidden} |
|||
.product-item .product-pic .img{width: 100%;height:180rpx;} |
|||
.product-item .product-info {padding:4rpx 10rpx;flex:1} |
|||
.product-item .product-info .p1 {color:#323232;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:72rpx} |
|||
.product-item .product-info .p2{height:50rpx;display:flex;align-items:center;color:#666;font-size:24rpx} |
|||
.product-item .product-info .p3{font-size:32rpx;height:40rpx;line-height:40rpx;display:flex;align-items:center} |
|||
.product-item .product-info .p3 .t1{flex:auto;font-size:28rpx;font-weight:bold} |
|||
.product-item .product-info .p3 .t1 .x2{margin-left:10rpx;font-size:26rpx;color: #888;} |
|||
.product-item .product-info .p3 .t2{padding:0 16rpx;font-size:22rpx;height:44rpx;line-height:44rpx;overflow: hidden;color:#fff;background:#4fee4f;border:0;border-radius:20rpx;} |
|||
.product-item .product-info .p3 button:after{border:0} |
|||
|
|||
.product-item .itembottom{width:100%;padding:0 20rpx;display:flex;height:100rpx;align-items:center} |
|||
.product-item .itembottom .f1{flex:1;color:#666;font-size:24rpx} |
|||
.product-item .itembottom .f2{color:#fff;width:160rpx;height:56rpx;display:flex;align-items:center;justify-content:center;border-radius:8rpx} |
|||
|
|||
.navbox{background: #fff;height: auto;overflow: hidden;padding-bottom: 0.1rpx;margin-bottom:12rpx} |
|||
.nav_li{width: 25%;text-align: center;box-sizing: border-box;padding:30rpx 0 10rpx;float: left;color:#333} |
|||
.nav_li image{width:80rpx;height: 80rpx;margin-bottom:10rpx;} |
|||
|
|||
.plr20{width: 100%;box-sizing: border-box;padding: 0 10rpx;margin-bottom: 10rpx;} |
|||
.tj_title{background: #fff;height: 70rpx;width: 100%;box-sizing: border-box;padding: 0 20rpx;line-height: 70rpx;display: flex;align-items: center;border-radius: 10rpx;} |
|||
.icon1{width: 40rpx;margin-right: 14rpx} |
|||
|
|||
.weui-search-bar__box{ position: relative} |
|||
.weui-icon-search{ position: absolute;width:32rpx; top:12rpx;left:40%} |
|||
.weui-search-bar__input{ background: #fff;padding:0 10px; margin:10px; border-radius:5px; text-align: center;} |
|||
|
|||
.topsearch{width:100%;max-width:750px;padding:16rpx 20rpx;background:#f6f6f6} |
|||
.topsearch .f1{height:70rpx;border-radius:8rpx;border:1px solid #eeeeee;background-color:#fff;flex:1} |
|||
.topsearch .f1 image{width:34rpx;height:34rpx;margin-left:20rpx} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:24rpx;color:#333;border:0;background:#fff} |
|||
.search-btn{color:#5a5a5a;font-size:30rpx;width:60rpx;text-align:center;margin-left:20rpx} |
|||
|
|||
.covermy{position:absolute;z-index:99999;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;z-index:9999;top:260rpx;right:0;color:#fff;background-color:rgba(17,17,17,0.3);width:140rpx;height:60rpx;font-size:26rpx;border-radius:30rpx 0px 0px 30rpx;} |
|||
</style> |
|||
@ -0,0 +1,372 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
<view class="t2" v-if="djs">剩余时间:{{djs}}</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择'+codtxt : '已成功付款'}}</view> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" v-if="detail.freight_type!=3" user-select="true" selectable="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul + '/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true" selectable="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1 && detail.freight_type!=3" user-select="true" selectable="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true" selectable="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="btitle flex-y-center" v-if="detail.bid>0"> |
|||
<image :src="detail.binfo.logo" style="width:36rpx;height:36rpx;" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid"></image> |
|||
<text class="flex1" decode="true" space="true" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid" style="padding-left:16rpx">{{detail.binfo.name}}</text> |
|||
</view> |
|||
<view class="product"> |
|||
<view v-for="(item, idx) in prolist" :key="idx" class="content"> |
|||
<view @tap="goto" :data-url="'product?id=' + item.proid"> |
|||
<image :src="item.pic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.name}}</text> |
|||
<text class="t2">市场价¥{{item.sell_price}}</text> |
|||
<view class="t3"><text class="x1 flex1"><text v-if="item.money_price>0">¥{{item.money_price}}+</text>{{item.score_price}}{{t('积分')}}</text><text class="x2">×{{item.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true" selectable="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytype!='货到付款' && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付方式</text> |
|||
<text class="t2">{{detail.paytype == '货到付款' ? codtxt : detail.paytype}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red" v-if="detail.totalmoney">¥{{detail.totalmoney}} + {{detail.totalscore}}{{t('积分')}}</text> |
|||
<text class="t2 red" v-else>{{detail.totalscore}}{{t('积分')}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_type==1 && detail.freightprice > 0"> |
|||
<text class="t1">服务费</text> |
|||
<text class="t2 red">+¥{{detail.freight_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}} + {{detail.totalscore}}{{t('积分')}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<text class="t2" v-if="detail.status==1">已付款</text> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款原因</text> |
|||
<text class="t2 red">{{detail.refund_reason}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_checkremark"> |
|||
<text class="t1">审核备注</text> |
|||
<text class="t2 red">{{detail.refund_checkremark}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.isfuwu && detail.fuwuendtime > 0"> |
|||
<text class="t1">到期时间</text> |
|||
<text class="t2 red">{{_.date(detail.fuwuendtime,'Y-m-d H:i')}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true" selectable="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="detail.status==1"> |
|||
<block v-if="detail.paytype!='货到付款'"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice + '&score=' + detail.totalscore">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn ref">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2"> |
|||
<block v-if="detail.paytype!='货到付款'"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice + '&score=' + detail.totalscore">申请退款</view> |
|||
</block> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="orderCollect" :data-id="detail.id" v-if="detail.paytype!='货到付款'">确认收货</view> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
<block v-if="(detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3 || detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul + '/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
prodata: '', |
|||
djs: '', |
|||
detail: "", |
|||
prolist: "", |
|||
shopset: "", |
|||
storeinfo: "", |
|||
lefttime: "", |
|||
codtxt: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiScoreshop/orderdetail', {id: that.opt.id}, function (res) { |
|||
uni.stopPullDownRefresh(); |
|||
that.loading = false; |
|||
that.detail = res.detail; |
|||
that.prolist = res.prolist; |
|||
that.shopset = res.shopset; |
|||
that.storeinfo = res.storeinfo; |
|||
that.lefttime = res.lefttime; |
|||
that.codtxt = res.codtxt; |
|||
that.isload = 1; |
|||
if (res.lefttime > 0) { |
|||
interval = setInterval(function () { |
|||
that.lefttime = that.lefttime - 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
var totalsec = that.lefttime; |
|||
|
|||
if (totalsec <= 0) { |
|||
that.djs = '00时00分00秒'; |
|||
} else { |
|||
var houer = Math.floor(totalsec / 3600); |
|||
var min = Math.floor((totalsec - houer * 3600) / 60); |
|||
var sec = totalsec - houer * 3600 - min * 60; |
|||
var djs = (houer < 10 ? '0' : '') + houer + '时' + (min < 10 ? '0' : '') + min + '分' + (sec < 10 ? '0' : '') + sec + '秒'; |
|||
that.djs = djs; |
|||
} |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiScoreshop/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiScoreshop/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('收货中'); |
|||
app.post('ApiScoreshop/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{height: 80rpx;line-height: 40rpx;color: #000;overflow:hidden} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.product .content .comment2{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc7c2 solid; border-radius:10rpx;background:#fff; color: #ffc7c2; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%;height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px;left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
|
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
.btitle{ width:100%;height:100rpx;background:#fff;padding:0 20rpx;border-bottom:1px solid #f5f5f5} |
|||
.btitle .comment{border: 1px #ffc702 solid;border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.btitle .comment2{border: 1px #ffc7c0 solid;border-radius:10rpx;background:#fff; color: #ffc7c0; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,231 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['全部','待付款','待发货','待收货','已完成','退款']" :itemst="['all','0','1','2','3','10']" :st="st" :isfixed="true" @changetab="changetab"></dd-tab> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<view>订单号:{{item.ordernum}}</view> |
|||
<view class="flex1"></view> |
|||
<text v-if="item.status==0" class="st0">待付款</text> |
|||
<text v-if="item.status==1 && item.freight_type!=1" class="st1">待发货</text> |
|||
<text v-if="item.status==1 && item.freight_type==1" class="st1">待提货</text> |
|||
<text v-if="item.status==2" class="st2">待收货</text> |
|||
<text v-if="item.status==3" class="st3">已完成</text> |
|||
<text v-if="item.status==4" class="st4">已关闭</text> |
|||
</view> |
|||
|
|||
<block v-for="(item2, idx) in item.prolist" :key="idx"> |
|||
<view class="content" :style="idx+1==item.procount?'border-bottom:none':''"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item2.proid"> |
|||
<image :src="item2.pic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item2.name}}</text> |
|||
<text class="t2">市场价¥{{item2.sell_price}}</text> |
|||
<view class="t3"><text class="x1 flex1"><text v-if="item2.money_price>0">¥{{item2.money_price}}+</text>{{item2.score_price}}{{t('积分')}}</text><text class="x2">×{{item2.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<view class="bottom"> |
|||
<text>共计{{item.procount}}件商品 实付:¥{{item.totalprice}}</text> |
|||
<text v-if="item.refund_status==1" style="color:red"> 退款中¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==2" style="color:red"> 已退款¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==3" style="color:red"> 退款申请已驳回</text> |
|||
</view> |
|||
<view class="op"> |
|||
<view @tap.stop="goto" :data-url="'orderdetail?id=' + item.id" class="btn2">详情</view> |
|||
<block v-if="item.status==0"> |
|||
<view class="btn2" @tap.stop="toclose" :data-id="item.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="goto" :data-url="'/pages/pay/pay?id=' + item.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="item.status==1"> |
|||
<block v-if="item.paytype!='货到付款'"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice + '&score=' + item.totalscore">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
</block> |
|||
<block v-if="item.status==2"> |
|||
<block v-if="item.paytype!='货到付款'"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice + '&score=' + item.totalscore">申请退款</view> |
|||
</block> |
|||
<block v-else> |
|||
<view class="btn2">{{codtxt}}</view> |
|||
</block> |
|||
<view class="btn2" @tap.stop="goto" :data-url="'/pages/order/logistics?express_com=' + item.express_com + '&express_no=' + item.express_no" v-if="item.freight_type!=3 && item.freight_type!=4">查看物流</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="orderCollect" :data-id="item.id" v-if="item.paytype!='货到付款'">确认收货</view> |
|||
</block> |
|||
<block v-if="item.status==3 || item.status==4"> |
|||
<view class="btn2" @tap.stop="todel" :data-id="item.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nodata: false, |
|||
nomore: false, |
|||
codtxt: "", |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiScoreshop/orderlist', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
uni.setNavigationBarTitle({ |
|||
title: that.t('积分')+'兑换订单' |
|||
}); |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiScoreshop/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiScoreshop/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.post('ApiScoreshop/orderCollect', {orderid: orderid}, function (data) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;margin-top:90rpx} |
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
.order-box .head .st0{ width: 140rpx; color: #ff8758; text-align: right; } |
|||
.order-box .head .st1{ width: 140rpx; color: #ffc702; text-align: right; } |
|||
.order-box .head .st2{ width: 140rpx; color: #ff4246; text-align: right; } |
|||
.order-box .head .st3{ width: 140rpx; color: #999; text-align: right; } |
|||
.order-box .head .st4{ width: 140rpx; color: #bbb; text-align: right; } |
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
/*.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px; font-size: 14px; position: absolute; bottom: 10px; right: 10px; background: #fff; }*/ |
|||
.order-pin{ border: 1px #ffc702 solid; border-radius: 5px; color: #ffc702; float: right; padding: 0 5px; height: 23px; line-height: 23px; margin-left: 5px;} |
|||
|
|||
.zan-tex{clear:both; display: block; width: 100%; color: #565656; font-size: 12px; height: 30px; line-height: 30px; text-align: center; } |
|||
.ind-bot{ width: 100%; float: left; text-align: center; height: 50px; line-height: 50px; font-size: 13px; color: #ccc; background:#F2F2F2} |
|||
|
|||
</style> |
|||
@ -0,0 +1,93 @@ |
|||
<template> |
|||
<view class="poster-detail"> |
|||
<view class="nav-bar" :style="{'height': navHeight}"> |
|||
<view class="" style="height: 30px;display: flex;margin-bottom: 4px;align-items: center;" @click="goBack"> |
|||
<text class="iconfont icon-icon_arrow_left" style="font-size: 40rpx; margin-left: 20rpx;"></text> |
|||
</view> |
|||
</view> |
|||
<image class="img" :src="imgUrl" mode="widthFix"></image> |
|||
<view class="btn" @click="goBack">立即去兑换</view> |
|||
<!-- 悬浮按钮 --> |
|||
<drag-button></drag-button> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
imgUrl: '', |
|||
navHeight: 0, |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
let setText = JSON.parse(options.setText) |
|||
let title = '' |
|||
if (options.num == 0) { |
|||
this.imgUrl = setText.introduce |
|||
title = '活动介绍' |
|||
}else { |
|||
this.imgUrl = setText.gain |
|||
title = '知味豆获取' |
|||
} |
|||
uni.setNavigationBarTitle({ |
|||
title: title |
|||
}) |
|||
|
|||
let elemetn |
|||
// #ifdef MP-WEIXIN |
|||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect() |
|||
uni.getSystemInfo({ |
|||
success: res => { |
|||
elemetn = res.statusBarHeight |
|||
} |
|||
}) |
|||
// #endif |
|||
// #ifdef MP-WEIXIN |
|||
this.navHeight = ((menuButtonInfo.bottom + menuButtonInfo.top) - elemetn) + 'px' |
|||
// #endif |
|||
// #ifndef MP |
|||
this.navHeight = 60 + 'px' |
|||
// #endif |
|||
}, |
|||
methods: { |
|||
goBack() { |
|||
uni.navigateBack() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.poster-detail { |
|||
.nav-bar { |
|||
width: 100%; |
|||
display: flex; |
|||
align-items: flex-end; |
|||
position: fixed; |
|||
top: 0; |
|||
left: 0; |
|||
z-index: 22; |
|||
} |
|||
.img { |
|||
width: 100%; |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
.btn { |
|||
width: 540rpx; |
|||
height: 80rpx; |
|||
line-height: 80rpx; |
|||
position: fixed; |
|||
bottom: 60rpx; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
z-index: 333; |
|||
border-radius: 200rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
background-image: linear-gradient(to right , #00AE68 , #096742); |
|||
} |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,514 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="pages-hd" :style="[ |
|||
{'height': history_show?'100%': 'auto'}, |
|||
{'padding-top': menuButtonTop + 'px'}, |
|||
{'background': 'url(' + event_rul + '/static/images/head-bg.png)'}, |
|||
{'background-size': '100% 638rpx'}, |
|||
{'background-repeat': 'no-repeat'}]"> |
|||
<!-- <image class="pages-hd__bg" :src="event_rul + '/static/img/home/header-bg.png'" mode="widthFix"></image> --> |
|||
<view class="pages-hd__info" :style="'height: ' + menuButtonHeight +'px'"> |
|||
<text class="iconfont icon-icon_arrow_left" @click="goBack"></text> |
|||
<view class="pages-hd__title">积分商城</view> |
|||
</view> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<!-- <image :src=event_rul + '/static/img/static/img/search_ico.png'"></image> --> |
|||
<text class="iconfont icon-search"></text> |
|||
<input :value="keyword" placeholder="商品搜索..." placeholder-style="color: #FFF;" @confirm="searchConfirm" @input="searchChange"/> |
|||
</view> |
|||
|
|||
<view class="right"> |
|||
<text @tap="goPoster(0)">活动介绍</text> |
|||
<text @tap="goPoster(1)">知味豆获取</text> |
|||
</view> |
|||
</view> |
|||
<view class="search-history" v-show="history_show"> |
|||
<view> |
|||
<text class="search-history-title">最近搜索</text> |
|||
<view class="delete-search-history" @tap="deleteSearchHistory"> |
|||
<text class="fa fa-trash-o" style="font-size:36rpx"></text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="search-history-list" > |
|||
<view v-for="(item, index) in history_list" :key="index" class="search-history-item" :data-value="item" @tap="historyClick">{{item}} |
|||
</view> |
|||
<view v-if="!history_list || history_list.length==0"><text class="fa fa-exclamation-circle"></text> 暂无记录 </view> |
|||
</view> |
|||
</view> |
|||
<view class="search-navbar" v-show="!history_show"> |
|||
|
|||
<view @tap.stop="sortClick" :class="'search-navbar-item ' + (!field?'active':'')" data-field="" data-order=""><text>综合</text></view> |
|||
<view @tap.stop="sortClick" :class="'search-navbar-item ' + (field=='sales'?'active':'')" data-field="sales" data-order="desc"><text>兑换</text></view> |
|||
<view @tap.stop="sortClick" :class="'search-navbar-item ' + (field=='createtime'?'active':'')" data-field="createtime" data-order="desc"><text>上新</text></view> |
|||
<view style="display: flex; color: #999;" @tap.stop="sortClick" :class="'search-navbar-item ' + (field=='score_price'?'active':'')" class="search-navbar-item" data-field="score_price" :data-order="order=='asc'?'desc':'asc'"> |
|||
<text style="color: #333;">使用豆子 |
|||
</text> |
|||
<view style="border: 0;font-weight: bold; font-size: 26rpx; " :style="{color:field=='score_price'&&order=='asc'?'#0A5D3B':''}" class="iconfont icon-danbianjiantou1"></view> |
|||
<view style="border: 0; font-weight: bold; font-size: 26rpx; margin-left: -10rpx;" :style="{color:field=='score_price'&&order=='desc'?'#0A5D3B':''}" class="iconfont icon-danbianjiantou"></view> |
|||
|
|||
|
|||
<!-- <view :class="'fa fa-caret-up ' + (field=='score_price'&&order=='asc'?'active':'')"></view> --> |
|||
<!-- <view :class="'fa fa-caret-down ' + (field=='score_price'&&order=='desc'?'active':'')"></view> --> |
|||
</view> |
|||
<!-- <view class="search-navbar-item flex-x-center flex-y-center" @tap.stop="filterClick">筛选 --> |
|||
<!-- <image :src=event_rul + '/static/img/static/img/filter.png'" style="width:40rpx;height:40rpx"></image> --> |
|||
<!-- </view> --> |
|||
</view> |
|||
<view class="search-filter" v-if="showfilter"> |
|||
<view class="search-filter-content" :if="glist && glist.length >0"> |
|||
<block v-for="(item, index) in glist" :key="index"> |
|||
<button @tap.stop="groupClick" :data-gid="item.id"> |
|||
<view class="icon"><icon type="success_no_circle" size="18" v-if="gid == item.id"></icon></view><view>{{item.name}}</view> |
|||
</button> |
|||
</block> |
|||
</view> |
|||
<view class="search-filter-content" :if="clist && clist.length >0" style="border-top:1px solid #f5f5f5"> |
|||
<block v-for="(item, index) in clist" :key="index"> |
|||
<button @tap.stop="cateClick" :data-cid="item.id"> |
|||
<view class="icon"><icon type="success_no_circle" size="18" v-if="cid == item.id"></icon></view><view>{{item.name}}</view> |
|||
</button> |
|||
</block> |
|||
</view> |
|||
<view class="search-filter-content" style="border-top:1px solid #eee;text-align:right"><div class="close"><text @tap.stop="filterClick">关闭</text></div></view> |
|||
</view> |
|||
</view> |
|||
<view class="product-container" v-show="!history_show" :style="'padding-top:' + hdHeight + 'px;'"> |
|||
<view class="product-list" v-if="datalist && datalist.length>0" > |
|||
<block style="display: flex; flex-wrap: wrap;" v-for="(item, index) in datalist" :key="index"> |
|||
<view @tap="goto" :data-url="'product?id=' + item.id" class="product-item"> |
|||
<view class="product-pic"> |
|||
<image :src="item.pic" mode="aspectFill"></image> |
|||
</view> |
|||
<view class="product-info"> |
|||
<view class="product-info__name">{{item.name}}</view> |
|||
<view class="product-info__sales">已售{{item.sales}}</view> |
|||
<view class="product-info__shop" @click="goShopDetail(item.bid)"> |
|||
<image class="shop-logo" :src="item.business.logo"></image> |
|||
<view class="shop-name">{{item.business.name}}</view> |
|||
<text class="iconfont icon-arrow-right" v-if="item.bid!=0"></text> |
|||
</view> |
|||
<view class="product-info__bottom"> |
|||
<image class="price-icon" :src="event_rul + '/static/images/zhiweidou.svg'"></image> |
|||
<view class="price-num" v-if="item.score_price>0">{{item.score_price || 0}}</view> |
|||
<view class="price-num" v-if="item.money_price>0"><block v-if="item.score_price>0">+</block>{{item.money_price}}元</view> |
|||
<view class="product-buy">兑换</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nodata text="没有查找到相关商品" v-if="nodata"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<nomore text="没有更多商品了" v-if="nomore"></nomore> |
|||
</view> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
<!-- 悬浮按钮 --> |
|||
<drag-button></drag-button> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
menuindex:-1, |
|||
|
|||
textset:{}, |
|||
nomore:false, |
|||
nodata:false, |
|||
keyword: '', |
|||
pagenum: 1, |
|||
datalist: [], |
|||
history_list: [], |
|||
history_show: false, |
|||
order: '', |
|||
field:'', |
|||
cid: "", |
|||
clist: [], |
|||
glist: [], |
|||
productlisttype: 'item2', |
|||
showfilter: "", |
|||
cpid:0, |
|||
socIndx:{}, |
|||
menuButtonTop: 0, |
|||
menuButtonHeight: 50, |
|||
hdHeight: 0, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.cid = this.opt.cid; |
|||
this.keyword = this.opt.keyword; |
|||
|
|||
// #ifdef MP |
|||
// 获取右上角胶囊坐标信息 |
|||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect(); |
|||
this.menuButtonTop = menuButtonInfo.top; // 胶囊到顶部的距离 |
|||
this.menuButtonHeight = menuButtonInfo.height; // 胶囊的高度 |
|||
// #endif |
|||
setTimeout(() => { |
|||
uni.createSelectorQuery().select('.pages-hd').boundingClientRect(data => { |
|||
this.hdHeight = data.height; |
|||
}).exec(); |
|||
}) |
|||
|
|||
this.getdata(); |
|||
this.getScoIndex() |
|||
|
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getprolist(); |
|||
} |
|||
}, |
|||
methods: { |
|||
goPoster(e){ |
|||
uni.navigateTo({ |
|||
url:'/activity/scoreshop/poster?num=' + e + '&setText=' + JSON.stringify(this.socIndx) |
|||
}) |
|||
}, |
|||
goShopDetail(bid){ |
|||
if(bid!=0) { |
|||
uni.navigateTo({ |
|||
url:'/pagesA/shop/index?id=' + bid |
|||
}) |
|||
} |
|||
}, |
|||
// 获取活动介绍和知味豆获取 |
|||
getScoIndex() { |
|||
app.get('ApiScoreshop/index', {}, res => { |
|||
this.socIndx = res.set |
|||
}) |
|||
}, |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
var cid = that.opt.cid; |
|||
var gid = that.opt.gid; |
|||
that.loading = true; |
|||
app.get('ApiScoreshop/prolist', {cid: cid,gid: gid}, function (res) { |
|||
that.loading = false; |
|||
that.clist = res.clist; |
|||
that.textset = app.globalData.textset; |
|||
that.loaded(); |
|||
that.getprolist(); |
|||
}); |
|||
}, |
|||
getprolist: function () { |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var keyword = that.keyword; |
|||
var order = that.order; |
|||
var field = that.field; |
|||
var gid = that.gid; |
|||
var cid = that.cid; |
|||
var cpid = that.cpid; |
|||
that.history_show = false; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiScoreshop/getprolist',{pagenum: pagenum,keyword: keyword,field: field,order: order,gid: gid,cid: cid,cpid:cpid}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
searchChange: function (e) { |
|||
this.keyword = e.detail.value; |
|||
if (e.detail.value == '') { |
|||
this.history_show = true; |
|||
this.datalist = []; |
|||
} |
|||
}, |
|||
searchbtn: function () { |
|||
var that = this; |
|||
if (that.history_show) { |
|||
var keyword = that.keyword; |
|||
that.searchproduct(); |
|||
} else { |
|||
if (that.productlisttype == 'itemlist') { |
|||
that.productlisttype = 'item2'; |
|||
app.setCache('productlisttype', 'item2'); |
|||
} else { |
|||
that.productlisttype = 'itemlist'; |
|||
app.setCache('productlisttype', 'itemlist'); |
|||
} |
|||
} |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.searchproduct(); |
|||
}, |
|||
searchproduct: function () { |
|||
var that = this; |
|||
that.pagenum = 1; |
|||
that.datalist = []; |
|||
that.addHistory(); |
|||
that.getprolist(); |
|||
}, |
|||
sortClick: function (e) { |
|||
var that = this; |
|||
var t = e.currentTarget.dataset; |
|||
that.field = t.field === true?'':t.field; |
|||
that.order = t.order; |
|||
that.searchproduct(); |
|||
}, |
|||
groupClick: function (e) { |
|||
var that = this; |
|||
var gid = e.currentTarget.dataset.gid; |
|||
if (gid == this.gid) { |
|||
that.gid = ''; |
|||
} else { |
|||
that.gid = gid |
|||
} |
|||
that.searchproduct(); |
|||
}, |
|||
cateClick: function (e) { |
|||
var that = this; |
|||
var cid = e.currentTarget.dataset.cid; |
|||
if (cid == this.cid) { |
|||
that.cid = ''; |
|||
} else { |
|||
that.cid = cid; |
|||
} |
|||
that.searchproduct(); |
|||
}, |
|||
filterClick: function () { |
|||
this.showfilter = !this.showfilter |
|||
}, |
|||
addHistory: function () { |
|||
var that = this; |
|||
var keyword = that.keyword; |
|||
if (app.isNull(keyword)) return; |
|||
var historylist = app.getCache('search_history_list'); |
|||
if (app.isNull(historylist)) historylist = []; |
|||
historylist.unshift(keyword); |
|||
var newhistorylist = []; |
|||
for (var i in historylist) { |
|||
if (historylist[i] != keyword || i == 0) { |
|||
newhistorylist.push(historylist[i]); |
|||
} |
|||
} |
|||
if (newhistorylist.length > 5) newhistorylist.splice(5, 1); |
|||
app.setCache('search_history_list', newhistorylist); |
|||
that.history_list = newhistorylist |
|||
}, |
|||
historyClick: function (e){ |
|||
var that = this; |
|||
var keyword = e.currentTarget.dataset.value; |
|||
if (keyword.length == 0) return; |
|||
that.keyword = keyword; |
|||
that.searchproduct(); |
|||
}, |
|||
deleteSearchHistory: function () { |
|||
var that = this; |
|||
that.history_list = null; |
|||
app.removeCache("search_history_list"); |
|||
}, |
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1, |
|||
}) |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style lang='scss'> |
|||
.pages-hd { |
|||
position: fixed;width: 100%;background: #fff;z-index:3;top:var(--window-top); |
|||
&__bg { |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
width: 100%; |
|||
z-index: -1; |
|||
} |
|||
&__info { |
|||
display: flex; |
|||
align-items: center; |
|||
color: #FFF; |
|||
padding: 0 45rpx 0 20rpx; |
|||
} |
|||
&__title { |
|||
font-size: 36rpx; |
|||
font-weight: 500; |
|||
flex: 1; |
|||
text-align: center; |
|||
} |
|||
.icon-icon_arrow_left { |
|||
font-size: 50rpx; |
|||
} |
|||
} |
|||
.topsearch{width:100%;padding: 20rpx 24rpx 24rpx; |
|||
.right{ |
|||
flex-shrink: 0; |
|||
display: flex; |
|||
padding-left: 20rpx; |
|||
text{ |
|||
font-size: 26rpx; |
|||
color: #FFF; |
|||
} |
|||
text + text { |
|||
margin-left: 24rpx; |
|||
} |
|||
} |
|||
} |
|||
.topsearch .f1{height:72rpx;border-radius:72rpx;border:0;background-color:rgba($color: #FFFFFF, $alpha: 0.3);flex:1;} |
|||
.topsearch .f1 image{width:30rpx;height:30rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#FFF;} |
|||
.icon-search {color: #FFF; margin-left: 20rpx; font-size: 50rpx;} |
|||
.search-btn{color:#5a5a5a;font-size:30rpx;width:60rpx;text-align:center;margin-left:20rpx} |
|||
.search-navbar {display: flex;height: 92rpx;line-height: 92rpx;text-align: center;align-items:center;background: #F5F5F5;border-radius: 12rpx 12rpx 0 0;} |
|||
.search-navbar-item {flex: 1;} |
|||
.search-navbar .active{ |
|||
text{ |
|||
color: #0A5D3B; |
|||
} |
|||
} |
|||
|
|||
.search-navbar-item .fa-caret-up {position: absolute;top: 12rpx;padding: 0 6rpx;font-size: 24rpx;color:#ddd;} |
|||
.search-navbar-item .fa-caret-down {position: absolute;top: 24rpx;padding: 0 6rpx;font-size: 24rpx;color:#ddd;} |
|||
.search-history {padding: 24rpx 34rpx;} |
|||
.search-history .search-history-title {color: #FFF;} |
|||
.search-history .delete-search-history {float: right;padding: 15rpx 20rpx;margin-top: -15rpx;} |
|||
.search-history-list {padding: 24rpx 0 0 0;} |
|||
.search-history-list .search-history-item {display: inline-block;height: 50rpx;line-height: 50rpx;padding: 0 20rpx;margin: 0 10rpx 10rpx 0;background: #ddd;border-radius: 10rpx;font-size: 26rpx;} |
|||
|
|||
.search-filter {display: flex;flex-direction: column;text-align: left;width:100%;flex-wrap:wrap;padding:6rpx;border-top:1px solid #ddd;border-bottom:1px solid #f5f5f0;} |
|||
.search-filter-content{display: flex;flex-wrap:wrap;padding:10rpx 0;} |
|||
.search-filter-content button{margin:4rpx 10rpx;font-size: 24rpx;display:flex;} |
|||
.search-filter-content .close{text-align: right;font-size:24rpx;width:100%;padding-right:20rpx} |
|||
.search-filter button .icon{margin-top:6rpx;height:54rpx;} |
|||
.product-list {display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%;font-size:26rpx;padding:0 16rpx;background: #F5F5F5;position: relative;z-index: 2;} |
|||
|
|||
.product-item{width: 350rpx; box-shadow: 0 0 10rpx 0 #ccc; overflow: hidden; display:flex;flex-direction:column;background: #fff; margin:0;margin-bottom:20rpx;border-radius:12rpx} |
|||
.product-item .product-pic { background: #ffffff;overflow:hidden} |
|||
.product-item .product-pic image{width: 100%;height: 300rpx;} |
|||
.product-item .product-info { |
|||
padding: 10rpx 20rpx 20rpx; |
|||
position: relative; |
|||
&::before,&::after { |
|||
content: ""; |
|||
position: absolute; |
|||
width: 28rpx; |
|||
height: 28rpx; |
|||
border-radius: 50%; |
|||
background: #F4F4F4; |
|||
bottom: 78rpx; |
|||
} |
|||
&::before { |
|||
left: -14rpx; |
|||
} |
|||
&::after { |
|||
right: -14rpx; |
|||
} |
|||
&__name { |
|||
height: 72rpx; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
line-height: 36rpx; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
/* autoprefixer: ignore next */ |
|||
-webkit-box-orient: vertical; |
|||
text-align: justify; |
|||
white-space: pre-wrap; |
|||
word-break: break-all; |
|||
} |
|||
&__sales { |
|||
margin-top: 10rpx; |
|||
height: 24rpx; |
|||
font-size: 18rpx; |
|||
color: #999999; |
|||
line-height: 22rpx; |
|||
} |
|||
&__shop { |
|||
margin-top: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
.shop-logo { |
|||
width: 50rpx; |
|||
height: 50rpx; |
|||
border-radius: 50%; |
|||
margin-right: 8rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
.shop-name { |
|||
flex: 1; |
|||
font-size: 22rpx; |
|||
color: #666666; |
|||
line-height: 36rpx; |
|||
} |
|||
} |
|||
&__bottom { |
|||
padding-top: 50rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
position: relative; |
|||
&::before { |
|||
content: ""; |
|||
position: absolute; |
|||
top: 25rpx; |
|||
left: 10rpx; |
|||
right: 10rpx; |
|||
border-top: 1rpx solid #F4F4F4; |
|||
transform: scaleY(0.5); |
|||
} |
|||
.price-icon { |
|||
width: 28rpx; |
|||
height: 28rpx; |
|||
} |
|||
.price-num { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #1BB149; |
|||
line-height: 44rpx; |
|||
flex: 1; |
|||
margin: 0 10rpx 0 6rpx; |
|||
} |
|||
.product-buy { |
|||
width: 84rpx; |
|||
background: linear-gradient(153deg, #00AE68 0%, #096742 100%); |
|||
height: 46rpx; |
|||
font-size: 24rpx; |
|||
font-weight: 500; |
|||
color: #FFFFFF; |
|||
line-height: 46rpx; |
|||
border-radius: 23rpx; |
|||
text-align: center; |
|||
float: right; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,96 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<form @submit="formSubmit" @reset="formReset" report-submit="true"> |
|||
<view class="form-item"> |
|||
<text class="label">退款原因</text> |
|||
<view class="input-item"><textarea placeholder="请输入退款原因" placeholder-style="color:#999;" name="reason"></textarea></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退款金额(元)</text> |
|||
<view class="flex"><input name="money" type="digit" disabled="true" :value="totalprice" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退回{{t('积分')}}</text> |
|||
<view class="flex"><input name="score" type="number" disabled="true" :value="totalscore" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<button class="ref-btn" form-type="submit">确定</button> |
|||
</form> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderid: '', |
|||
totalprice: 0, |
|||
totalscore: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.orderid = this.opt.orderid; |
|||
this.totalprice = this.opt.price; |
|||
this.totalscore = this.opt.score; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.post('ApiOrder/refundinit', {}, function (res) { |
|||
that.loading = false; |
|||
that.tmplids = res.tmplids; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var orderid = that.orderid; |
|||
var reason = e.detail.value.reason; |
|||
var money = parseFloat(e.detail.value.money); |
|||
var score = parseInt(e.detail.value.score); |
|||
|
|||
if (reason == '') { |
|||
app.alert('请填写退款原因'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiScoreshop/refund', {orderid: orderid,reason: reason,money: money,score:score}, function (res) { |
|||
app.showLoading(false); |
|||
app.alert(res.msg); |
|||
if (res.status == 1) { |
|||
that.subscribeMessage(function () { |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item{ width:100%;background: #fff; padding: 32rpx 20rpx;} |
|||
.form-item .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item .input-item{ width:100%;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx; background-color: #EEEEEE;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx} |
|||
.form-item .mid{ height:80rpx;line-height:80rpx;padding:0 20rpx;} |
|||
.ref-btn{ width: 90%; margin: 0 5%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 8px;border: none; background: #ff8758; } |
|||
</style> |
|||
@ -0,0 +1,733 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul +'/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}} <text v-if="address.company">{{address.company}}</text></view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
<view class="buydata"> |
|||
<view class="btitle"><image class="img" :src="event_rul +'/static/img/static/img/ico-shop.png'"/>{{business.name}}</view> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex"> |
|||
<view class="img"> |
|||
<image class="img" v-if="guige.pic" :src="guige.pic"></image> |
|||
<image class="img" v-else :src="product.pic"></image> |
|||
</view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f2">规格:{{guige.name}}</view> |
|||
<view class="f3">¥{{guige.sell_price}}<text v-if="buytype!=1" class="collage_icon">秒杀价</text> × {{num}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice*1 > product_price*1">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">商品金额</text> |
|||
<text class="f2">¥{{product_price}}</text> |
|||
</view> |
|||
<view class="price" v-if="leveldk_money*1>0"> |
|||
<text class="f1">{{t('会员')}}折扣({{userinfo.discount}}折)</text> |
|||
<text class="f2">-¥{{leveldk_money}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freight_price}}</text> |
|||
</view> |
|||
|
|||
<view class="price"> |
|||
<view class="f1">{{t('优惠券')}}</view> |
|||
<view v-if="couponList.length>0" class="f2" @tap="showCouponList"><text style="color:#fff;padding:4rpx 16rpx;font-weight:normal;border-radius:8rpx;font-size:24rpx" :style="{background:t('color1')}">{{couponrid!=0?couponList[couponkey].couponname:couponList.length+'张可用'}}</text><text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
<text class="f2" v-else style="color:#999">无可用{{t('优惠券')}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="scoredk flex" v-if="userinfo.score2money > 0"> |
|||
<checkbox-group @change="scoredk" class="flex" style="width:100%"> |
|||
<view class="f1"> |
|||
<view>{{userinfo.score*1}} {{t('积分')}}可抵扣 <text style="color:#e94745">{{userinfo.scoredk_money*1}}</text> 元</view> |
|||
<view style="font-size:22rpx;color:#999" v-if="userinfo.scoredkmaxpercent > 0 && userinfo.scoredkmaxpercent<100">最多可抵扣订单金额的{{userinfo.scoredkmaxpercent}}%</view> |
|||
</view> |
|||
<view class="f2">使用{{t('积分')}}抵扣 |
|||
<checkbox value="1" style="margin-left:6px;transform:scale(.8)"></checkbox> |
|||
</view> |
|||
</checkbox-group> |
|||
</view> |
|||
<view style="width: 100%;height:110rpx"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="text1 flex1">总计: |
|||
<text style="font-weight:bold;font-size:36rpx">¥{{totalprice}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="couponvisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{t('优惠券')}}</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="handleClickMask"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<couponlist :couponlist="couponList" :choosecoupon="true" :selectedrid="couponrid" :bid="product.bid" @chooseCoupon="chooseCoupon"></couponlist> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
business:{}, |
|||
productList: [], |
|||
freightList: [], |
|||
couponList: [], |
|||
couponrid: 0, |
|||
coupontype: 1, |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
usescore: 0, |
|||
totalprice: '0.00', |
|||
product_price: 0, |
|||
leveldk_money: 0, |
|||
scoredk_money: 0, |
|||
coupon_money: 0, |
|||
storedata: [], |
|||
storeid: '', |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
isload: 0, |
|||
leadermoney: 0, |
|||
couponvisible: false, |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
product: "", |
|||
guige: "", |
|||
userinfo: "", |
|||
buytype: "", |
|||
scorebdkyf: "", |
|||
num: "", |
|||
havetongcheng: "", |
|||
weight: "", |
|||
goodsnum: "", |
|||
beizhu: "", |
|||
couponkey: 0, |
|||
storeshowall:false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiSeckill/buy', {prodata:that.opt.prodata}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg,function(){ |
|||
app.goback(); |
|||
});return; |
|||
} |
|||
var product = res.product; |
|||
var guige = res.guige; |
|||
var freightList = res.freightList; |
|||
var userinfo = res.userinfo; |
|||
var couponList = res.couponList; |
|||
that.business = res.business; |
|||
that.product = product; |
|||
that.guige = guige; |
|||
that.freightList = freightList; |
|||
that.userinfo = userinfo; |
|||
that.couponList = couponList; |
|||
that.buytype = res.buytype; |
|||
that.address = res.address; |
|||
that.scorebdkyf = res.scorebdkyf; |
|||
that.num = res.num; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
var leadermoney = 0; //商品总价 重量 |
|||
|
|||
var product_price = guige.sell_price * res.num; |
|||
var weight = guige.weight; |
|||
var goodsnum = 0; |
|||
|
|||
if (res.buytype == 2 && product.leadermoney * 1 > 0) { |
|||
leadermoney = product.leadermoney * 1; |
|||
} |
|||
leadermoney = leadermoney.toFixed(2); //会员折扣 |
|||
var leveldk_money = 0; |
|||
if (userinfo.discount > 0 && userinfo.discount < 10) { |
|||
leveldk_money = (product_price - leadermoney) * (1 - userinfo.discount * 0.1); |
|||
leveldk_money = leveldk_money.toFixed(2); |
|||
} |
|||
product_price = product_price.toFixed(2); |
|||
that.product_price = parseFloat(product_price); |
|||
that.leadermoney = leadermoney; |
|||
that.leveldk_money = leveldk_money; |
|||
that.weight = weight; |
|||
that.scoredk_money = userinfo.scoredk_money; |
|||
that.goodsnum = goodsnum; |
|||
that.isload = 1; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
|
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
|
|||
for (var j in freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude) { |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
//积分抵扣 |
|||
scoredk: function (e) { |
|||
var usescore = e.detail.value[0]; |
|||
if (!usescore) usescore = 0; |
|||
this.usescore = usescore; |
|||
this.calculatePrice(); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var product_price = parseFloat(that.product_price); //+商品总价 |
|||
var leadermoney = parseFloat(that.leadermoney); //-团长优惠 |
|||
var leveldk_money = parseFloat(that.leveldk_money); //-会员折扣 |
|||
var coupon_money = parseFloat(that.coupon_money); //-优惠券抵扣 |
|||
var address = that.address; //算运费 |
|||
var freightdata = that.freightList[that.freightkey]; |
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress; |
|||
var freight_price = freightdata.freight_price; |
|||
|
|||
if (that.coupontype == 4) { |
|||
freight_price = 0; |
|||
coupon_money = 0; |
|||
} |
|||
var totalprice = product_price - leadermoney - leveldk_money - coupon_money; |
|||
if (totalprice < 0) totalprice = 0; //优惠券不抵扣运费 |
|||
|
|||
var oldtotalprice = totalprice; |
|||
if (that.usescore) { |
|||
var scoredk_money = parseFloat(that.scoredk_money); //-积分抵扣 |
|||
} else { |
|||
var scoredk_money = 0; |
|||
} |
|||
totalprice = totalprice + freight_price - scoredk_money; |
|||
if (that.scorebdkyf == '1' && scoredk_money > 0 && totalprice < freight_price) { |
|||
//积分不抵扣运费 |
|||
totalprice = freight_price; |
|||
scoredk_money = oldtotalprice - freight_price; |
|||
} |
|||
var scoredkmaxpercent = parseFloat(that.userinfo.scoredkmaxpercent); //最大抵扣比例 |
|||
|
|||
if (scoredk_money > 0 && scoredkmaxpercent > 0 && scoredkmaxpercent < 100 && scoredk_money > oldtotalprice * scoredkmaxpercent * 0.01) { |
|||
scoredk_money = oldtotalprice * scoredkmaxpercent * 0.01; |
|||
totalprice = oldtotalprice - scoredk_money; |
|||
} |
|||
if (totalprice < 0) totalprice = 0; |
|||
freight_price = freight_price.toFixed(2); |
|||
totalprice = totalprice.toFixed(2); |
|||
that.totalprice = totalprice |
|||
that.freight_price = freight_price; |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
chooseCoupon: function (e) { |
|||
var couponrid = e.rid; |
|||
var couponkey = e.key; |
|||
|
|||
if (couponrid == this.couponrid) { |
|||
this.couponkey = 0; |
|||
this.couponrid = 0; |
|||
this.coupontype = 1; |
|||
this.coupon_money = 0; |
|||
this.couponvisible = false; |
|||
} else { |
|||
var couponList = this.couponList; |
|||
var coupon_money = couponList[couponkey]['money']; |
|||
var coupontype = couponList[couponkey]['type']; |
|||
if (coupontype == 4) { |
|||
coupon_money = this.freightprice; |
|||
} |
|||
this.couponkey = couponkey; |
|||
this.couponrid = couponrid; |
|||
this.coupontype = coupontype; |
|||
this.coupon_money = coupon_money; |
|||
this.couponvisible = false; |
|||
} |
|||
this.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var prodata = this.opt.prodata; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
var usescore = this.usescore; |
|||
var couponkey = this.couponkey; |
|||
var couponrid = this.couponrid; |
|||
var freight_time = that.freight_time; //console.log(yhqrecoid); return; |
|||
|
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
|
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
|
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/createOrder', { |
|||
proid: that.product.id, |
|||
ggid: that.guige.id, |
|||
num: that.num, |
|||
storeid: storeid, |
|||
couponrid: couponrid, |
|||
freightid: freightid, |
|||
freight_time: freight_time, |
|||
addressid: addressid, |
|||
usescore: usescore, |
|||
linkman: linkman, |
|||
tel: tel, |
|||
formdata: newformdata |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.error(data.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + data.payorderid); |
|||
}); |
|||
}, |
|||
showCouponList: function () { |
|||
this.couponvisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.couponvisible = false; |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:10rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .text1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .text1 text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
|
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,192 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form-item1"> |
|||
<view class="label">商品信息</view> |
|||
<view class="product flex"> |
|||
<view class="img"><image :src="og.propic"></image></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{og.proname}}</view> |
|||
<view class="f2">{{og.ggname}}</view> |
|||
<view class="f3">¥{{og.sell_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item2 flex flex-y-center"> |
|||
<view class="label">您的打分</view> |
|||
<view class="i-rate" @touchmove="handleTouchMove"> |
|||
<input type="text" name="score" :value="score" class="i-rate-hide-input"></input> |
|||
<view v-for="(item, index) in 5" :key="index" class="i-rate-star" :class="( index < score ? 'i-rate-current':'' )" :data-index="index" @tap="handleClick"> |
|||
<image v-if="index < score" :src="event_rul +'/static/img/static/img/star2.png'"></image> |
|||
<image v-else :src="event_rul +'/static/img/static/img/star.png'"></image> |
|||
</view> |
|||
<view class="i-rate-text"></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item3 flex-col"> |
|||
<view class="label">您的评价</view> |
|||
<textarea placeholder="输入您的评价内容" placeholder-style="color:#ccc;" name="content" :value="comment.content" style="height:200rpx" :disabled="comment.id?true:false"></textarea> |
|||
</view> |
|||
|
|||
<view class="form-item4 flex-col"> |
|||
<view class="label">上传图片</view> |
|||
<view id="content_picpreview" class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view v-for="(item, index) in content_pic" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="content_pic" v-if="!comment.id"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" bindtap="xuanzhuan" data-index="{{index}}" data-field="content_pic" wx:if="{{!comment.id}}"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="content_pic" v-if="!comment.id && content_pic.length<5"></view> |
|||
</view> |
|||
</view> |
|||
<button class="subbtn" form-type="submit" v-if="!comment.id">确定</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
og:{}, |
|||
comment:{}, |
|||
score: 0, |
|||
content_pic: [], |
|||
tempFilePaths: "", |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
that.loading = true; |
|||
app.get('ApiSeckill/comment', {orderid: orderid}, function (res) { |
|||
that.loading = false; |
|||
that.og = res.og; |
|||
if (res.comment){ |
|||
that.comment = res.comment; |
|||
that.score = res.comment.score; |
|||
var content_pic = res.comment.content_pic; |
|||
that.content_pic = content_pic.split(','); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
var score = e.detail.value.score; |
|||
var content = e.detail.value.content; |
|||
var content_pic = that.content_pic; |
|||
if (score == 0) { |
|||
app.error('请打分'); |
|||
return; |
|||
} |
|||
if (content == '') { |
|||
app.error('请填写评价内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/comment', {orderid: orderid,content: content,content_pic: content_pic.join(','),score: score}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 2000); |
|||
}); |
|||
}, |
|||
handleClick: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.score = index + 1; |
|||
}, |
|||
handleTouchMove: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var clientWidth = uni.getSystemInfoSync().windowWidth; |
|||
if (!e.changedTouches[0]) return; |
|||
var movePageX = e.changedTouches[0].pageX; |
|||
var space = movePageX - 150 / 750 * clientWidth; |
|||
if (space <= 0) return; |
|||
var starwidth = 60 / 750 * clientWidth; |
|||
var setIndex = Math.ceil(space / starwidth); |
|||
setIndex = setIndex > 5 ? 5 : setIndex; |
|||
this.score = setIndex; |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pic') that.pic = pics; |
|||
if(field == 'pics') that.pics = pics; |
|||
if(field == 'zhengming') that.zhengming = pics; |
|||
},1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item1{ width:100%;background: #fff; padding: 8rpx 20rpx;} |
|||
.form-item1 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.product{ width: 100%; background: #fff; } |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f2{color: #a4a4a4; font-size:24rpx} |
|||
.product .info .f3{color: #ff0d51; font-size:28rpx} |
|||
.product image{ width:140rpx;height:140rpx} |
|||
|
|||
.form-item2{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item2 .label{ width:150rpx;height:60rpx;line-height:60rpx} |
|||
|
|||
.form-item3{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item3 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item3 textarea{width: 100%;border: 1px #dedede solid; border-radius: 10rpx; padding: 10rpx;height: 120rpx;} |
|||
|
|||
|
|||
.form-item4{width:100%;background: #fff; padding: 20rpx 20rpx;margin-top:1px} |
|||
.form-item4 .label{ width:150rpx;} |
|||
/*.form-item4 image{ width: 100rpx; height: 100rpx;background:#eee;margin-right:6rpx} |
|||
.form-item4 .imgbox{height:100rpx}*/ |
|||
|
|||
.subbtn{ width: 90%; margin: 0 5%;margin-top:40rpx; height: 40px; line-height: 40px; color: #fff; background: #e94745; } |
|||
|
|||
.i-rate{margin:0;padding:0;display:inline-block;vertical-align:middle;} |
|||
.i-rate-hide-input{display:none} |
|||
.i-rate-star{display:inline-block;color:#e9e9e9;padding:0 10rpx} |
|||
.i-rate-star image{width:50rpx;height:50rpx} |
|||
.i-rate-current{color:#f5a623} |
|||
.i-rate-text{display:inline-block;vertical-align:middle;margin-left:6px;font-size:14px} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="comment"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="item.headimg"/> |
|||
<view class="t2">{{item.nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (item.score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view style="color:#777;font-size:22rpx;">{{item.createtime}}</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="item.content_pic!=''"> |
|||
<block v-for="(itemp, index) in item.content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="item.content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" v-if="item.reply_content"> |
|||
<view class="arrow"></view> |
|||
<view class="t1">商家回复:{{item.reply_content}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata" text="暂无评价~"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiSeckill/commentlist', {proid: that.opt.proid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{background:#fff} |
|||
.comment{display:flex;flex-direction:column;padding:10rpx 0;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{width:100%;padding:10rpx 0;position:relative} |
|||
.comment .item .f3 .arrow{width: 16rpx;height: 16rpx;background:#eee;transform: rotate(45deg);position:absolute;top:0rpx;left:36rpx} |
|||
.comment .item .f3 .t1{width:100%;border-radius:10rpx;padding:10rpx;font-size:22rpx;color:#888;background:#eee} |
|||
|
|||
</style> |
|||
@ -0,0 +1,183 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="navbg"></view> |
|||
<view class="nav"> |
|||
<scroll-view scroll-x="true" :scroll-left="top_bar_scroll"> |
|||
<view class="f1"> |
|||
<block v-for="(item, index) in navlist" :key="index"> |
|||
<view :class="'item ' + (selected==index?'active':'')" @tap="changetab" :data-index="index"> |
|||
<view class="t3">{{item.seckill_date_m}}</view> |
|||
<view class="t1">{{item.showtime}}</view> |
|||
<view class="t2" v-if="item.active==-1">已结束</view> |
|||
<view class="t2" v-if="item.active==0">已开抢</view> |
|||
<view class="t2" v-if="item.active==1">抢购中</view> |
|||
<view class="t2" v-if="item.active==2">即将开始</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
<view class="content"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<image class="f1" mode="widthFix" :src="item.pic" @tap="goto" :data-url="'product?id=' + item.id"></image> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.name}}</text> |
|||
<view class="t2" :style="{color:t('color1')}"> |
|||
<progress :percent="item.salepercent" backgroundColor="#FFD1C9" activeColor="#FF3143" border-radius="3" class="progress"></progress> |
|||
<text class="x2">{{item.salepercent}}%</text> |
|||
</view> |
|||
<view class="t3"> |
|||
<text class="x1" :style="{color:t('color1')}"><text style="font-size:24rpx">¥</text>{{item.sell_price}}</text> |
|||
<text class="x2">¥{{item.market_price}}</text> |
|||
<button @tap="goto" :data-url="'product?id=' + item.id" class="x3" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}" v-if="item.starttime <nowtime && seckill_duration*3600+item.starttime*1 > nowtime">立即抢购</button> |
|||
<button @tap="goto" :data-url="'product?id=' + item.id" class="x3 xx1" v-else-if="item.starttime*1+seckill_duration*3600 < nowtime">去看看</button> |
|||
<button @tap="goto" :data-url="'product?id=' + item.id" class="x3" v-else :style="{background:t('color2')}">抢先看看</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="item" style="display:block" v-if="nodata"><nodata></nodata></view> |
|||
<nomore v-if="nomore"></nomore> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
bid:'', |
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
navlist: "", |
|||
activetime: "", |
|||
activeindex: "", |
|||
selected: "", |
|||
top_bar_scroll: "", |
|||
seckill_duration: "", |
|||
nowtime: "", |
|||
nomore: false, |
|||
nodata:false, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st; |
|||
this.bid = this.opt.bid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getDataList(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.post('ApiSeckill/index', {}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
} else { |
|||
that.navlist = res.navlist; |
|||
that.activetime = res.activetime; |
|||
that.activeindex = res.selected; |
|||
that.selected = res.selected; |
|||
that.top_bar_scroll = (res.selected - 2) * uni.getSystemInfoSync().windowWidth / 750 * 150; |
|||
that.seckill_duration = res.seckill_duration; |
|||
that.nowtime = res.nowtime; |
|||
that.getDataList(); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
changetab: function (e) { |
|||
var index = e.currentTarget.dataset.index; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.selected = index; |
|||
this.getDataList(); |
|||
}, |
|||
getDataList: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var selected = that.selected; |
|||
var navlist = that.navlist; |
|||
var pagenum = that.pagenum; |
|||
that.nomore = false; |
|||
that.nodata = false; |
|||
app.post('ApiSeckill/getprolist', {bid:that.bid,seckill_date: navlist[selected].seckill_date,seckill_time: navlist[selected].seckill_time,pagenum: pagenum}, function (res) { |
|||
uni.stopPullDownRefresh(); |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{width:100%;overflow:hidden} |
|||
.navbg{width: 100%;position:relative} |
|||
.navbg:after {background: linear-gradient(90deg,rgba(253, 74, 70, 1) 0%,rgba(253, 74, 70, 0.8) 100%);content: '';width: 160%;height:300rpx;position: absolute;left: -30%;top:0;border-radius: 0 0 50% 50%;z-index:1} |
|||
.nav {width: 100%;position:relative;z-index:2} |
|||
.nav>scroll-view {overflow: visible !important;padding-top:20rpx;padding-bottom:20rpx} |
|||
.nav .f1 {flex-grow: 0;flex-shrink: 0;display:flex;align-items:center;color:#fff;position:relative;z-index:2} |
|||
.nav .f1 .item{flex-grow: 0;flex-shrink: 0;width:150rpx;text-align:center;padding:16rpx 0;opacity: 0.6;} |
|||
.nav .f1 .item .t1 {font-size:34rpx;font-weight:bold} |
|||
.nav .f1 .item .t2 {font-size:24rpx} |
|||
.nav .f1 .item .t3 {font-size:30rpx} |
|||
.nav .f1 .item.active {position: relative;color:#fff;opacity:1} |
|||
|
|||
.content{width:94%;margin-left:3%;position:relative;z-index:3} |
|||
.data-empty{background:#fff;border-radius:16rpx} |
|||
.content .item{width:100%;display:flex;padding: 20rpx;background:#fff;border-radius:16rpx;margin-bottom:20rpx} |
|||
.item .f1{width:200rpx;height:200rpx;margin-right:20rpx;} |
|||
.item .f2{position: relative; padding-right: 20rpx;flex:1;display:flex;flex-direction:column} |
|||
.item .f2 .t1{font-size:28rpx;font-weight:bold;color: #222;margin-top: 2px;height:80rpx;overflow:hidden} |
|||
.item .f2 .t2{width:100%;margin-top:12rpx;display:flex;align-items:center} |
|||
.item .f2 .t2 .x2{padding-left:16rpx;font-size:24rpx;font-weight:bold} |
|||
.item .f2 .t3{width:100%;margin-top:20rpx;display:flex;align-items:flex-end} |
|||
.item .f2 .t3 .x1{font-size:32rpx;font-weight:bold} |
|||
.item .f2 .t3 .x2{color:#999999;font-size:24rpx;text-decoration:line-through;padding-left:8rpx} |
|||
.item .f2 .t3 .x3{position:absolute;bottom:0;right:0;border: 0;color: #fff;font-size:28rpx;padding:0 28rpx;height:54rpx;line-height:50rpx;border-radius:54rpx;margin:0} |
|||
.item .f2 .t3 .x3.xx1{background:#888} |
|||
|
|||
.progress{width:240rpx;font-size:24rpx} |
|||
.nomore-footer-tips{background:#fff!important} |
|||
</style> |
|||
@ -0,0 +1,330 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择货到付款' : '已成功付款'}}</view> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" user-select="true" selectable="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul +'/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true" selectable="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1" user-select="true" selectable="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true" selectable="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btitle flex-y-center" v-if="detail.bid>0"> |
|||
<image :src="detail.binfo.logo" style="width:36rpx;height:36rpx;" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid"></image> |
|||
<text class="flex1" decode="true" space="true" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid" style="padding-left:16rpx">{{detail.binfo.name}}</text> |
|||
</view> |
|||
|
|||
<view class="product"> |
|||
<view class="content"> |
|||
<view @tap="goto" :data-url="'product?id=' + detail.proid"> |
|||
<image :src="detail.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{detail.proname}}</text> |
|||
<text class="t2">{{detail.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{detail.sell_price}}</text><text class="x2">×{{detail.num}}</text></view> |
|||
</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==0 && seckillset.comment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">去评价</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">查看评价</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true" selectable="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true" selectable="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{detail.product_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.leveldk_money > 0"> |
|||
<text class="t1">{{t('会员')}}折扣</text> |
|||
<text class="t2 red">-¥{{detail.leveldk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.coupon_money > 0"> |
|||
<text class="t1">{{t('优惠券')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.coupon_money}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.scoredk_money > 0"> |
|||
<text class="t1">{{t('积分')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.scoredk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">实付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<text v-if="detail.status==1 && detail.freight_type!=1" class="t2">待发货</text> |
|||
<text v-if="detail.status==1 && detail.freight_type==1" class="t2">待提货</text> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true" selectable="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot" v-if="detail.status!=3"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="detail.status==1"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.totalprice">申请退款</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="orderCollect" :data-id="detail.id">确认收货</view> |
|||
</block> |
|||
<block v-if="([1,2,3]).includes(detail.status) && invoice"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=seckill&orderid=' + detail.id">发票</view> |
|||
</block> |
|||
<block v-if="(detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3"> |
|||
<view class="btn2">已完成</view> |
|||
</block> |
|||
<block v-if="detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
detail:{}, |
|||
team:{}, |
|||
storeinfo:{}, |
|||
seckillset:{}, |
|||
invoice:0, |
|||
event_rul: app.globalData.event_url, |
|||
} |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function (option) { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiSeckill/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.detail = res.detail; |
|||
that.team = res.team; |
|||
that.storeinfo = res.storeinfo; |
|||
that.seckillset = res.seckillset; |
|||
that.invoice = res.invoice; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiSeckill/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;position:relative} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%; height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px; left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
|
|||
|
|||
.btitle{ width:100%;height:100rpx;background:#fff;padding:0 20rpx;border-bottom:1px solid #f5f5f5} |
|||
.btitle .comment{border: 1px #ffc702 solid;border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.btitle .comment2{border: 1px #ffc7c0 solid;border-radius:10rpx;background:#fff; color: #ffc7c0; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
</style> |
|||
@ -0,0 +1,214 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<dd-tab :itemdata="['全部','待付款','待发货','待收货','已完成','退款']" :itemst="['all','0','1','2','3','10']" :st="st" :isfixed="true" @changetab="changetab"></dd-tab> |
|||
<view class="order-content"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box" @tap="goto" :data-url="'orderdetail?id=' + item.id"> |
|||
<view class="head"> |
|||
<view class="f1" v-if="item.bid!=0" @tap.stop="goto" :data-url="'/pages/business/index?id=' + item.bid"><image :src="event_rul + '/static/img/static/img/ico-shop.png'"></image> {{item.binfo.name}}</view> |
|||
<view v-else>订单号:{{item.ordernum}}</view> |
|||
<view class="flex1"></view> |
|||
<text v-if="item.status==0" class="st0">待付款</text> |
|||
<text v-if="item.status==1 && item.freight_type!=1" class="st1">待发货</text> |
|||
<text v-if="item.status==1 && item.freight_type==1" class="st1">待提货</text> |
|||
<text v-if="item.status==2" class="st2">待收货</text> |
|||
<text v-if="item.status==3" class="st3">已完成</text> |
|||
<text v-if="item.status==4" class="st4">已关闭</text> |
|||
</view> |
|||
|
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap.stop="goto" :data-url="'product?id=' + item.proid"> |
|||
<image :src="item.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.proname}}</text> |
|||
<text class="t2">{{item.ggname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{item.sell_price}}</text><text class="x2">×{{item.num}}</text></view> |
|||
</view> |
|||
</view> |
|||
<view class="bottom"> |
|||
<text>共计{{item.num}}件商品 实付:¥{{item.totalprice}}</text> |
|||
<text v-if="item.refund_status==1" style="color:red"> 退款中¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==2" style="color:red"> 已退款¥{{item.refund_money}}</text> |
|||
<text v-if="item.refund_status==3" style="color:red"> 退款申请已驳回</text> |
|||
</view> |
|||
<view class="op"> |
|||
<block v-if="([1,2,3]).includes(item.status) && item.invoice"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=seckill&orderid=' + item.id">发票</view> |
|||
</block> |
|||
<view @tap.stop="goto" :data-url="'orderdetail?id=' + item.id" class="btn2">详情</view> |
|||
<block v-if="item.status==0"> |
|||
<view class="btn2" @tap.stop="toclose" :data-id="item.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="goto" :data-url="'/pages/pay/pay?id=' + item.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="item.status==1"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
</block> |
|||
<block v-if="item.status==2"> |
|||
<view v-if="item.refund_status==0 || item.refund_status==3" class="btn2" @tap.stop="goto" :data-url="'refund?orderid=' + item.id + '&price=' + item.totalprice">申请退款</view> |
|||
<view class="btn2" @tap.stop="goto" :data-url="'/pages/order/logistics?express_com=' + item.express_com + '&express_no=' + item.express_no" v-if="item.freight_type!=3 && item.freight_type!=4">查看物流</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap.stop="orderCollect" :data-id="item.id">确认收货</view> |
|||
</block> |
|||
<block v-if="item.status==4"> |
|||
<view class="btn2" @tap.stop="todel" :data-id="item.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiSeckill/orderlist', {st: st,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiSeckill/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;margin-top:90rpx} |
|||
.order-content{display:flex;flex-direction:column} |
|||
.order-box{ width: 94%;margin:10rpx 3%;padding:6rpx 3%; background: #fff;border-radius:8px} |
|||
.order-box .head{ display:flex;width:100%; border-bottom: 1px #f4f4f4 solid; height: 70rpx; line-height: 70rpx; overflow: hidden; color: #999;} |
|||
.order-box .head .f1{display:flex;align-items:center;color:#333} |
|||
.order-box .head .f1 image{width:34rpx;height:34rpx;margin-right:4px} |
|||
.order-box .head .st0{ width: 140rpx; color: #ff8758; text-align: right; } |
|||
.order-box .head .st1{ width: 140rpx; color: #ffc702; text-align: right; } |
|||
.order-box .head .st2{ width: 140rpx; color: #ff4246; text-align: right; } |
|||
.order-box .head .st3{ width: 140rpx; color: #999; text-align: right; } |
|||
.order-box .head .st4{ width: 140rpx; color: #bbb; text-align: right; } |
|||
|
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #f4f4f4 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.order-box .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.order-box .content .detail .x1{ flex:1} |
|||
.order-box .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
|
|||
.order-box .bottom{ width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
.order-box .op{ display:flex;flex-wrap: wrap;justify-content:flex-end;align-items:center;width:100%; padding: 10rpx 0px; border-top: 1px #f4f4f4 solid; color: #555;} |
|||
|
|||
.btn1{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;margin-top: 10rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
</style> |
|||
@ -0,0 +1,689 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<block v-if="sysset.showgzts"> |
|||
<view style="width:100%;height:88rpx"> </view> |
|||
<view class="follow_topbar"> |
|||
<view class="headimg"><image :src="sysset.logo"/></view> |
|||
<view class="info"> |
|||
<view class="i">欢迎进入 <text :style="{color:t('color1')}">{{sysset.name}}</text></view> |
|||
<view class="i">关注公众号享更多专属服务</view> |
|||
</view> |
|||
<view class="sub" @tap="showsubqrcode" :style="{'background-color':t('color1')}">立即关注</view> |
|||
</view> |
|||
<uni-popup id="qrcodeDialog" ref="qrcodeDialog" type="dialog"> |
|||
<view class="qrcodebox"> |
|||
<image :src="sysset.qrcode" @tap="previewImage" :data-url="sysset.qrcode" class="img"/> |
|||
<view class="txt">长按识别二维码关注</view> |
|||
<view class="close" @tap="closesubqrcode"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<view style="position:fixed;top:15vh;left:20rpx;z-index:9;background:rgba(0,0,0,0.6);border-radius:20rpx;color:#fff;padding:0 10rpx" v-if="bboglist.length>0"> |
|||
<swiper style="position:relative;height:54rpx;width:350rpx;" :autoplay="true" :interval="5000" :vertical="true"> |
|||
<swiper-item v-for="(item, index) in bboglist" :key="index" @tap="goto" :data-url="'product?id=' + item.proid" class="flex-y-center"> |
|||
<image :src="item.headimg" style="width:40rpx;height:40rpx;border:1px solid rgba(255,255,255,0.7);border-radius:50%;margin-right:4px"/> |
|||
<div style="width:300rpx;white-space:nowrap;overflow:hidden;text-overflow: ellipsis;font-size:22rpx">{{item.nickname}} {{item.showtime}}购买了该商品</div> |
|||
</swiper-item> |
|||
</swiper> |
|||
</view> |
|||
<view class="swiper-container" v-if="isplay==0"> |
|||
<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="5000" @change="swiperChange"> |
|||
<block v-for="(item, index) in product.pics" :key="index"> |
|||
<swiper-item class="swiper-item"> |
|||
<view class="swiper-item-view"><image class="img" :src="item" mode="widthFix"/></view> |
|||
</swiper-item> |
|||
</block> |
|||
</swiper> |
|||
<view class="imageCount">{{current+1}}/{{(product.pics).length}}</view> |
|||
<view v-if="product.video" class="provideo" @tap="payvideo"><image :src="event_rul +'/static/img/static/img/video.png'"/><view class="txt">{{product.video_duration}}</view></view> |
|||
</view> |
|||
<view class="videobox" v-if="isplay==1"> |
|||
<video autoplay="true" class="video" id="video" :src="product.video"></video> |
|||
<view class="parsevideo" @tap="parsevideo">退出播放</view> |
|||
</view> |
|||
|
|||
<view class="seckill_title"> |
|||
<image :src="pre_url+'/static/img/tjms.png'" class="f0"/> |
|||
<view class="f1"> |
|||
<view class="t1"><text style="font-size:24rpx">¥</text>{{product.sell_price}}<text class="x2">¥{{product.market_price}}</text></view> |
|||
<view class="t2" v-if="seckill_status==0">秒杀未开始</view> |
|||
<view class="t2" v-if="seckill_status==1">火爆抢购中</view> |
|||
<view class="t2" v-if="seckill_status==2">秒杀已结束</view> |
|||
</view> |
|||
<view class="f3" v-if="seckill_status==0 || seckill_status==1"> |
|||
<view class="t1">距秒杀{{seckill_status==0?'开始':'结束'}}还剩</view> |
|||
<view class="t2" id="djstime"><text class="djsspan">{{djshour}}</text> : <text class="djsspan">{{djsmin}}</text> : <text class="djsspan">{{djssec}}</text></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="header"> |
|||
<view class="price_share"> |
|||
<view class="price"> |
|||
<view class="f1" :style="{color:t('color1')}"><text style="font-size:36rpx">¥</text>{{product.sell_price}}</view> |
|||
<view class="f2" v-if="product.market_price*1 > product.sell_price*1">¥{{product.market_price}}</view> |
|||
</view> |
|||
<view class="share" @tap="shareClick"><image class="img" :src="event_rul +'/static/img/static/img/share.png'"/><text class="txt">分享</text></view> |
|||
</view> |
|||
<view class="title">{{product.name}}</view> |
|||
<view class="sales_stock"> |
|||
<view class="f1">销量:{{product.sales}} </view> |
|||
<view class="f2">库存:{{product.stock}}</view> |
|||
</view> |
|||
<view class="commission" :style="{background:'rgba('+t('color1rgb')+',0.1)',color:t('color1')}" v-if="seckillset.showcommission==1 && product.commission > 0">分享好友购买预计可得{{t('佣金')}}:<text style="font-weight:bold;padding:0 2px">{{product.commission}}</text>元</view> |
|||
</view> |
|||
<view class="choose" @tap="buydialogChange" data-btntype="2"> |
|||
<view class="f1 flex1">请选择商品规格及数量</view> |
|||
<image class="f2" :src="event_rul +'/static/img/static/img/arrowright.png'"/> |
|||
</view> |
|||
|
|||
<view class="cuxiaodiv" v-if="product.givescore > 0"> |
|||
<view class="cuxiaopoint"> |
|||
<view class="f0">送{{t('积分')}}</view> |
|||
<view class="f1" style="font-size:26rpx">购买可得{{t('积分')}}{{product.givescore}}个</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cuxiaodiv" v-if="cuxiaolist.length>0 || couponlist.length>0 || product.discount_tips!=''"> |
|||
<view class="cuxiaopoint" v-if="cuxiaolist.length>0"> |
|||
<view class="f0">促销</view> |
|||
<view class="f1"> |
|||
<view v-for="(item, index) in cuxiaolist" :key="index" class="t" :style="{background:'rgba('+t('color1rgb')+',0.1)',color:t('color1')}"><text class="t0">{{item.tip}}</text><text class="t1">{{item.name}}</text></view> |
|||
</view> |
|||
<view class="f2" @tap="showcuxiaodetail"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/arrowright.png'"/> |
|||
</view> |
|||
</view> |
|||
<view class="cuxiaopoint" v-if="product.discount_tips!=''"> |
|||
<view class="f0">折扣</view> |
|||
<view class="f1" style="padding-left:10rpx">{{product.discount_tips}}</view> |
|||
<view class="f2" @tap="goto" data-url="/pages/my/levelinfo"> |
|||
<image :src="event_rul +'/static/img/static/img/arrow-point.png'" mode="widthFix"/> |
|||
</view> |
|||
</view> |
|||
<view class="cuxiaopoint" v-if="couponlist.length>0"> |
|||
<view class="f0">优惠</view> |
|||
<view class="f1"> |
|||
<view v-for="(item, index) in couponlist" :key="index" class="t" :style="{background:'rgba('+t('color1rgb')+',0.1)',color:t('color1')}"><text class="t0" style="padding:0 6px">券</text><text class="t1">{{item.name}}</text></view> |
|||
</view> |
|||
<view class="f2" @tap="showcuxiaodetail"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/arrow-point.png'"/> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view v-if="showcuxiaodialog" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidecuxiaodetail"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">优惠促销</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidecuxiaodetail"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view v-for="(item, index) in cuxiaolist" :key="index" class="service-item"> |
|||
<view class="suffix"> |
|||
<view class="type-name"><text style="border-radius:4px;border:1px solid #f05423;color: #ff550f;font-size:20rpx;padding:2px 5px">{{item.tip}}</text> <text style="color:#333;margin-left:20rpx">{{item.name}}</text></view> |
|||
</view> |
|||
</view> |
|||
<couponlist :couponlist="couponlist" @getcoupon="getcoupon"></couponlist> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="commentbox" v-if="seckillset.comment==1 && commentcount > 0"> |
|||
<view class="title"> |
|||
<view class="f1">评价({{commentcount}})</view> |
|||
<view class="f2" @tap="goto" :data-url="'commentlist?proid=' + product.id">好评度 <text :style="{color:t('color1')}">{{product.comment_haopercent}}%</text><image style="width:32rpx;height:32rpx;" :src="event_rul +'/static/img/static/img/arrowright.png'"/></view> |
|||
</view> |
|||
<view class="comment"> |
|||
<view class="item" v-if="commentlist.length>0"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="commentlist[0].headimg"/> |
|||
<view class="t2">{{commentlist[0].nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (commentlist[0].score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{commentlist[0].content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="commentlist[0].content_pic!=''"> |
|||
<block v-for="(itemp, index) in commentlist[0].content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="commentlist[0].content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" @tap="goto" :data-url="'commentlist?proid=' + product.id">查看全部评价</view> |
|||
</view> |
|||
<view v-else class="nocomment">暂无评价~</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="shop" v-if="seckillset.showjd==1"> |
|||
<image :src="business.logo" class="p1"/> |
|||
<view class="p2 flex1"> |
|||
<view class="t1">{{business.name}}</view> |
|||
<view class="t2">{{business.desc}}</view> |
|||
</view> |
|||
<button class="p4" :style="{background:'linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}" @tap="goto" :data-url="product.bid==0?'/pages/index/index':'/pages/business/index?id='+product.bid" data-opentype="reLaunch">进入店铺</button> |
|||
</view> |
|||
<view class="detail_title"><view class="t1"></view><view class="t2"></view><view class="t0">商品描述</view><view class="t2"></view><view class="t1"></view></view> |
|||
<view class="detail"> |
|||
<dp :pagecontent="pagecontent"></dp> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:140rpx;"></view> |
|||
<view class="bottombar flex-row" :class="menuindex>-1?'tabbarbot':'notabbarbot'" v-if="product.status==1"> |
|||
<view class="f1"> |
|||
<view class="item" @tap="goto" :data-url="kfurl" v-if="kfurl!='contact::'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</view> |
|||
<button class="item" v-else open-type="contact"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/kefu.png'"/> |
|||
<view class="t1">客服</view> |
|||
</button> |
|||
<view class="item flex1" @tap="shareClick"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/share2.png'"/> |
|||
<view class="t1">分享</view> |
|||
</view> |
|||
<view class="item" @tap="addfavorite"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/shoucang.png'"/> |
|||
<view class="t1">{{isfavorite?'已收藏':'收藏'}}</view> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<view class="tobuy flex-x-center flex-y-center" :style="{background:t('color1')}" @tap="buydialogChange" data-btntype="2" v-if="seckill_status==1">立即抢购</view> |
|||
<view class="tobuy flex-x-center flex-y-center" style="background:#ccc" v-else>立即抢购</view> |
|||
</view> |
|||
</view> |
|||
<scrolltop :isshow="scrolltopshow"></scrolltop> |
|||
|
|||
<view v-if="sharetypevisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal" style="height:320rpx;min-height:320rpx"> |
|||
<!-- <view class="popup__title"> |
|||
<text class="popup__title-text">请选择分享方式</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> --> |
|||
<view class="popup__content"> |
|||
<view class="sharetypecontent"> |
|||
<view class="f1" @tap="shareapp" v-if="getplatform() == 'app'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'mp'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<view class="f1" @tap="sharemp" v-else-if="getplatform() == 'h5'"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</view> |
|||
<button class="f1" open-type="share" v-else> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/weixin.png'"/> |
|||
<text class="t1">分享给好友</text> |
|||
</button> |
|||
<view class="f2" @tap="showPoster"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/sharepic.png'"/> |
|||
<text class="t1">生成分享图片</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="posterDialog" v-if="showposter"> |
|||
<view class="main"> |
|||
<view class="close" @tap="posterDialogClose"><image class="img" :src="event_rul +'/static/img/static/img/close.png'"/></view> |
|||
<view class="content"> |
|||
<image class="img" :src="posterpic" mode="widthFix" @tap="previewImage" :data-url="posterpic"></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<buydialog v-if="buydialogShow" :proid="product.id" :btntype="btntype" @buydialogChange="buydialogChange" :menuindex="menuindex" controller="ApiSeckill"></buydialog> |
|||
<scrolltop :isshow="scrolltopshow"></scrolltop> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
|
|||
export default { |
|||
|
|||
data() { |
|||
return { |
|||
|
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
initdata:{}, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
seckill_status:1, |
|||
nowtime:0, |
|||
seckill_duration:0, |
|||
seckill_starttime:0, |
|||
djshour:'00', |
|||
djsmin:'00', |
|||
djssec:'00', |
|||
buydialogShow: false, |
|||
btntype:1, |
|||
isfavorite: false, |
|||
current: 0, |
|||
isplay: 0, |
|||
showcuxiaodialog: false, |
|||
business: "", |
|||
product: [], |
|||
cartnum: "", |
|||
commentlist: "", |
|||
commentcount: "", |
|||
cuxiaolist: "", |
|||
couponlist: "", |
|||
pagecontent: "", |
|||
guigelist: "", |
|||
guigedata: "", |
|||
sysset:{}, |
|||
seckillset: "", |
|||
title: "", |
|||
bboglist: "", |
|||
sharepic: "", |
|||
sharetypevisible: false, |
|||
showposter: false, |
|||
posterpic: "", |
|||
scrolltopshow: false, |
|||
kfurl:'', |
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
|
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onShareAppMessage:function(){ |
|||
return this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var sharewxdata = this._sharewx({title:this.product.name,pic:this.product.pic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
|
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
|
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
var id = this.opt.id || 0; |
|||
that.loading = true; |
|||
app.post('ApiSeckill/product', {id: id}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
var product = res.product; |
|||
var sysset = res.sysset; |
|||
var pagecontent = JSON.parse(product.detail); |
|||
that.business = res.business; |
|||
that.product = product; |
|||
that.cartnum = res.cartnum; |
|||
that.commentlist = res.commentlist; |
|||
that.commentcount = res.commentcount; |
|||
that.cuxiaolist = res.cuxiaolist; |
|||
that.couponlist = res.couponlist; |
|||
that.pagecontent = pagecontent; |
|||
that.sysset = sysset; |
|||
that.seckillset = res.seckillset; |
|||
that.title = product.name; |
|||
that.isfavorite = res.isfavorite; |
|||
that.oglist = res.oglist; |
|||
that.sharepic = product.pics[0]; |
|||
that.nowtime = res.nowtime; |
|||
that.seckill_duration = res.seckill_duration, |
|||
that.seckill_starttime = res.product.starttime, |
|||
|
|||
that.getdjs(); |
|||
clearInterval(interval); |
|||
interval = setInterval(function(){ |
|||
that.nowtime = that.nowtime+1; |
|||
that.getdjs(); |
|||
},1000) |
|||
uni.setNavigationBarTitle({ |
|||
title: product.name |
|||
}); |
|||
that.kfurl = '/pages/kefu/index?bid='+res.product.bid; |
|||
if(app.globalData.initdata.kfurl != ''){ |
|||
that.kfurl = app.globalData.initdata.kfurl; |
|||
} |
|||
that.loaded({title:res.product.name,pic:res.product.pic}); |
|||
}); |
|||
}, |
|||
getdjs:function(){ |
|||
var that = this |
|||
var nowtime = that.nowtime*1; |
|||
var seckill_duration = that.seckill_duration*1; |
|||
var seckill_starttime = that.seckill_starttime*1; |
|||
var seckill_endtime = that.seckill_starttime + seckill_duration * 3600; |
|||
if(seckill_endtime < nowtime){ //已结束 |
|||
that.seckill_status = 2 |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
}else{ |
|||
if(seckill_starttime > nowtime){ //未开始 |
|||
that.seckill_status = 0 |
|||
var totalsec = seckill_starttime - nowtime; |
|||
}else{ //进行中 |
|||
that.seckill_status = 1 |
|||
var totalsec = seckill_endtime - nowtime; |
|||
} |
|||
var houer = Math.floor(totalsec/3600); |
|||
var min = Math.floor((totalsec - houer *3600)/60); |
|||
var sec = totalsec - houer*3600 - min*60 |
|||
var djs = (houer<10?'0':'')+houer+'时'+(min<10?'0':'')+min+'分'+(sec<10?'0':'')+sec+'秒'; |
|||
var djshour = (houer<10?'0':'')+houer |
|||
var djsmin = (min<10?'0':'')+min |
|||
var djssec = (sec<10?'0':'')+sec |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
|
|||
swiperChange: function (e) { |
|||
var that = this; |
|||
that.current = e.detail.current |
|||
}, |
|||
|
|||
payvideo: function () { |
|||
this.isplay = 1; |
|||
uni.createVideoContext('video').play(); |
|||
}, |
|||
|
|||
parsevideo: function () { |
|||
this.isplay = 0; |
|||
uni.createVideoContext('video').stop(); |
|||
}, |
|||
|
|||
buydialogChange: function (e) { |
|||
if(!this.buydialogShow){ |
|||
this.btntype = e.currentTarget.dataset.btntype |
|||
} |
|||
this.buydialogShow = !this.buydialogShow; |
|||
}, |
|||
|
|||
//收藏操作 |
|||
|
|||
addfavorite: function () { |
|||
var that = this; |
|||
var proid = that.product.id; |
|||
app.post('ApiSeckill/addfavorite', {proid: proid,type: 'seckill'}, function (data) { |
|||
if (data.status == 1) { |
|||
that.isfavorite = !that.isfavorite; |
|||
} |
|||
app.success(data.msg); |
|||
}); |
|||
}, |
|||
|
|||
shareClick: function () { |
|||
this.sharetypevisible = true; |
|||
}, |
|||
|
|||
handleClickMask: function () { |
|||
this.sharetypevisible = false |
|||
}, |
|||
showPoster: function () { |
|||
var that = this; |
|||
that.showposter = true; |
|||
that.sharetypevisible = false; |
|||
app.showLoading('生成海报中'); |
|||
app.post('ApiSeckill/getposter', {proid: that.product.id}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.alert(data.msg); |
|||
} else { |
|||
that.posterpic = data.poster; |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
posterDialogClose: function () { |
|||
this.showposter = false; |
|||
}, |
|||
|
|||
showcuxiaodetail: function () { |
|||
this.showcuxiaodialog = true; |
|||
}, |
|||
|
|||
hidecuxiaodetail: function () { |
|||
this.showcuxiaodialog = false |
|||
}, |
|||
getcoupon:function(){ |
|||
this.showcuxiaodialog = false; |
|||
this.getdata(); |
|||
}, |
|||
|
|||
onPageScroll: function (e) { |
|||
var that = this; |
|||
var scrollY = e.scrollTop; |
|||
if (scrollY > 200) { |
|||
that.scrolltopshow = true; |
|||
} |
|||
if(scrollY < 150) { |
|||
that.scrolltopshow = false |
|||
} |
|||
}, |
|||
sharemp:function(){ |
|||
app.error('点击右上角发送给好友或分享到朋友圈'); |
|||
this.sharetypevisible = false |
|||
}, |
|||
shareapp:function(){ |
|||
var that = this; |
|||
uni.showActionSheet({ |
|||
itemList: ['发送给微信好友', '分享到微信朋友圈'], |
|||
success: function (res){ |
|||
if(res.tapIndex >= 0){ |
|||
var scene = 'WXSceneSession'; |
|||
if (res.tapIndex == 1) { |
|||
scene = 'WXSenceTimeline'; |
|||
} |
|||
var sharedata = {}; |
|||
sharedata.provider = 'weixin'; |
|||
sharedata.type = 0; |
|||
sharedata.scene = scene; |
|||
sharedata.title = that.product.name; |
|||
//sharedata.summary = app.globalData.initdata.desc; |
|||
sharedata.href = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#/activity/seckill/product?scene=id_'+that.product.id+'-pid_' + app.globalData.mid; |
|||
sharedata.imageUrl = that.product.pic; |
|||
var sharelist = app.globalData.initdata.sharelist; |
|||
if(sharelist){ |
|||
for(var i=0;i<sharelist.length;i++){ |
|||
if(sharelist[i]['indexurl'] == '/activity/seckill/product'){ |
|||
sharedata.title = sharelist[i].title; |
|||
sharedata.summary = sharelist[i].desc; |
|||
sharedata.imageUrl = sharelist[i].pic; |
|||
if(sharelist[i].url){ |
|||
var sharelink = sharelist[i].url; |
|||
if(sharelink.indexOf('/') === 0){ |
|||
sharelink = app.globalData.pre_url +'/h5/'+app.globalData.aid+'.html#'+ sharelink; |
|||
} |
|||
if(app.globalData.mid>0){ |
|||
sharelink += (sharelink.indexOf('?') === -1 ? '?' : '&') + 'pid='+app.globalData.mid; |
|||
} |
|||
sharedata.href = sharelink; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
uni.share(sharedata); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
showsubqrcode:function(){ |
|||
this.$refs.qrcodeDialog.open(); |
|||
}, |
|||
closesubqrcode:function(){ |
|||
this.$refs.qrcodeDialog.close(); |
|||
}, |
|||
|
|||
} |
|||
|
|||
}; |
|||
</script> |
|||
<style> |
|||
.follow_topbar {height:88rpx; width:100%;max-width:640px; background:rgba(0,0,0,0.8); position:fixed; top:0; z-index:13;} |
|||
.follow_topbar .headimg {height:64rpx; width:64rpx; margin:6px; float:left;} |
|||
.follow_topbar .headimg image {height:64rpx; width:64rpx;} |
|||
.follow_topbar .info {height:56rpx; padding:16rpx 0;} |
|||
.follow_topbar .info .i {height:28rpx; line-height:28rpx; color:#ccc; font-size:24rpx;} |
|||
.follow_topbar .info {height:80rpx; float:left;} |
|||
.follow_topbar .sub {height:48rpx; width:auto; background:#FC4343; padding:0 20rpx; margin:20rpx 16rpx 20rpx 0; float:right; font-size:24rpx; color:#fff; line-height:52rpx; border-radius:6rpx;} |
|||
.qrcodebox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.qrcodebox .img{width:400rpx;height:400rpx} |
|||
.qrcodebox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.qrcodebox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
|
|||
.swiper-container{position:relative} |
|||
.swiper {width: 100%;height: 750rpx;overflow: hidden;} |
|||
.swiper-item-view{width: 100%;height: 750rpx;} |
|||
.swiper .img {width: 100%;height: 750rpx;overflow: hidden;} |
|||
|
|||
.imageCount {width:100rpx;height:50rpx;background-color: rgba(0, 0, 0, 0.3);border-radius:40rpx;line-height:50rpx;color:#fff;text-align:center;font-size:26rpx;position:absolute;right:13px;bottom:20rpx;} |
|||
|
|||
.provideo{background:rgba(255,255,255,0.7);width:160rpx;height:54rpx;padding:0 20rpx 0 4rpx;border-radius:27rpx;position:absolute;bottom:30rpx;left:50%;margin-left:-80rpx;display:flex;align-items:center;justify-content:space-between} |
|||
.provideo image{width:50rpx;height:50rpx;} |
|||
.provideo .txt{flex:1;text-align:center;padding-left:10rpx;font-size:24rpx;color:#333} |
|||
|
|||
.videobox{width:100%;height:750rpx;text-align:center;background:#000} |
|||
.videobox .video{width:100%;height:650rpx;} |
|||
.videobox .parsevideo{margin:0 auto;margin-top:20rpx;height:40rpx;line-height:40rpx;color:#333;background:#ccc;width:140rpx;border-radius:25rpx;font-size:24rpx} |
|||
|
|||
.seckill_title{ width:100%;height:110rpx;background: linear-gradient(90deg, #FF3143 0%, #FD6647 100%);display:flex;align-items:center;} |
|||
.seckill_title .f0{width:88rpx;height:88rpx;margin-left:20rpx} |
|||
.seckill_title .f1{flex:1;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.seckill_title .f1 .t1{font-size:40rpx;color:#fff;line-height:50rpx} |
|||
.seckill_title .f1 .t1 .x2{padding-left:8rpx;font-size:26rpx;color:#fff;text-decoration:line-through} |
|||
.seckill_title .f1 .t2{color:#fff;font-size:22rpx} |
|||
.seckill_title .f3{width:250rpx;height:110rpx;background:#FFDBDF;color:#333;display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.seckill_title .f3 .t2{color:#FF3143} |
|||
.seckill_title .djsspan{font-size:22rpx;border-radius:8rpx;background:#FF3143;color:#fff;text-align:center;padding:4rpx 8rpx;margin:0 4rpx} |
|||
|
|||
.header {width: 100%;padding: 20rpx 3%;background: #fff;} |
|||
.header .price_share{width:100%;height:100rpx;display:flex;align-items:center;justify-content:space-between} |
|||
.header .price_share .price{display:flex;align-items:flex-end} |
|||
.header .price_share .price .f1{font-size:50rpx;color:#51B539;font-weight:bold} |
|||
.header .price_share .price .f2{font-size:26rpx;color:#C2C2C2;text-decoration:line-through;margin-left:30rpx;padding-bottom:5px} |
|||
.header .price_share .share{display:flex;flex-direction:column;align-items:center;justify-content:center} |
|||
.header .price_share .share .img{width:32rpx;height:32rpx;margin-bottom:2px} |
|||
.header .price_share .share .txt{color:#333333;font-size:20rpx} |
|||
.header .title {color:#000000;font-size:32rpx;line-height:42rpx;font-weight:bold;} |
|||
.header .sales_stock{display:flex;justify-content:space-between;height:60rpx;line-height:60rpx;margin-top:30rpx;font-size:24rpx;color:#777777} |
|||
.header .commission{display:inline-block;margin-top:20rpx;margin-bottom:10rpx;border-radius:10rpx;font-size:20rpx;height:44rpx;line-height:44rpx;padding:0 20rpx} |
|||
|
|||
.choose{ display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; height: 88rpx; line-height: 88rpx;padding: 0 3%; color: #333; } |
|||
.choose .f2{ width: 32rpx; height: 32rpx;} |
|||
|
|||
.cuxiaodiv{background:#fff;margin-top:20rpx;padding: 0 3%;} |
|||
.cuxiaopoint{width:100%;font-size:24rpx;color:#333;height:88rpx;line-height:88rpx;padding:12rpx 0;display:flex;align-items:center} |
|||
.cuxiaopoint .f0{color:#777777;height:32rpx;font-size:24rpx;padding-right:20rpx;display:flex;justify-content:center;align-items:center} |
|||
.cuxiaopoint .f1{margin-right:20rpx;flex:1;display:flex;flex-wrap:nowrap;overflow:hidden} |
|||
.cuxiaopoint .f1 .t{margin-left:10rpx;border-radius:3px;font-size:24rpx;height:40rpx;line-height:40rpx;padding-right:10rpx;flex-shrink:0;overflow:hidden} |
|||
.cuxiaopoint .f1 .t0{display:inline-block;padding:0 5px;} |
|||
.cuxiaopoint .f1 .t1{padding:0 4px} |
|||
.cuxiaopoint .f2{flex-shrink:0;display:flex;align-items:center;width:32rpx;height: 32rpx;} |
|||
.cuxiaopoint .f2 .img{width:32rpx;height:32rpx;} |
|||
.cuxiaodiv .cuxiaopoint{border-bottom:1px solid #E6E6E6;} |
|||
.cuxiaodiv .cuxiaopoint:last-child{border-bottom:0} |
|||
|
|||
.popup__container{position: fixed;bottom: 0;left: 0;right: 0;width:100%;height:auto;z-index:10;background:#fff} |
|||
.popup__overlay{position: fixed;bottom: 0;left: 0;right: 0;width:100%;height: 100%;z-index: 11;opacity:0.3;background:#000} |
|||
.popup__modal{width: 100%;position: absolute;bottom: 0;color: #3d4145;overflow-x: hidden;overflow-y: hidden;opacity:1;padding-bottom:20rpx;background: #fff;border-radius:20rpx 20rpx 0 0;z-index:12;min-height:600rpx;max-height:1000rpx;} |
|||
.popup__title{text-align: center;padding:30rpx;position: relative;position:relative} |
|||
.popup__title-text{font-size:32rpx} |
|||
.popup__close{position:absolute;top:34rpx;right:34rpx} |
|||
.popup__content{width:100%;max-height:880rpx;overflow-y:scroll;padding:20rpx 0;} |
|||
.service-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.service-item .prefix{padding-top: 2px;} |
|||
.service-item .suffix{padding-left: 10rpx;} |
|||
.service-item .suffix .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;} |
|||
|
|||
|
|||
.shop{display:flex;align-items:center;width: 100%; background: #fff; margin-top: 20rpx; padding: 20rpx 3%;position: relative; min-height: 100rpx;} |
|||
.shop .p1{width:90rpx;height:90rpx;border-radius:6rpx;flex-shrink:0} |
|||
.shop .p2{padding-left:10rpx} |
|||
.shop .p2 .t1{width: 100%;height:40rpx;line-height:40rpx;overflow: hidden;color: #111;font-weight:bold;font-size:30rpx;} |
|||
.shop .p2 .t2{width: 100%;height:30rpx;line-height:30rpx;overflow: hidden;color: #999;font-size:24rpx;margin-top:8rpx} |
|||
.shop .p4{height:64rpx;line-height:64rpx;color:#FFFFFF;border-radius:32rpx;margin-left:20rpx;flex-shrink:0;padding:0 30rpx;font-size:24rpx;font-weight:bold} |
|||
|
|||
.detail{min-height:200rpx;} |
|||
|
|||
.detail_title{width:100%;display:flex;align-items:center;justify-content:center;margin-top:60rpx;margin-bottom:30rpx} |
|||
.detail_title .t0{font-size:28rpx;font-weight:bold;color:#222222;margin:0 20rpx} |
|||
.detail_title .t1{width:12rpx;height:12rpx;background:rgba(253, 74, 70, 0.2);transform:rotate(45deg);margin:0 4rpx;margin-top:6rpx} |
|||
.detail_title .t2{width:18rpx;height:18rpx;background:rgba(253, 74, 70, 0.4);transform:rotate(45deg);margin:0 4rpx} |
|||
|
|||
.commentbox{width:100%;background:#fff;padding:0 3%;margin-top:20rpx} |
|||
.commentbox .title{height:90rpx;line-height:90rpx;border-bottom:1px solid #DDDDDD;display:flex} |
|||
.commentbox .title .f1{flex:1;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.commentbox .title .f2{color:#333;font-weight:bold;font-size:28rpx;display:flex;align-items:center} |
|||
.commentbox .nocomment{height:100rpx;line-height:100rpx} |
|||
|
|||
.comment{display:flex;flex-direction:column;min-height:200rpx;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{margin:20rpx auto;padding:0 30rpx;height:60rpx;line-height:60rpx;border:1px solid #E6E6E6;border-radius:30rpx;color:#111111;font-weight:bold;font-size:26rpx} |
|||
|
|||
.bottombar{ width: 94%; position: fixed;bottom: 0px; left: 0px; background: #fff;display:flex;height:100rpx;padding:0 4% 0 2%;align-items:center;box-sizing:content-box} |
|||
.bottombar .f1{flex:1;display:flex;align-items:center;margin-right:30rpx} |
|||
.bottombar .f1 .item{display:flex;flex-direction:column;align-items:center;width:80rpx;position:relative} |
|||
.bottombar .f1 .item .img{ width:44rpx;height:44rpx} |
|||
.bottombar .f1 .item .t1{font-size:18rpx;color:#222222;height:30rpx;line-height:30rpx;margin-top:6rpx} |
|||
.bottombar .op{width:60%;border-radius:36rpx;overflow:hidden;display:flex;} |
|||
.bottombar .tobuy{flex:1;height: 72rpx; line-height: 72rpx;color: #fff; border-radius: 0px; border: none;} |
|||
|
|||
.sharetypecontent{ height:250rpx;width:710rpx;margin:20rpx;display:flex;padding:50rpx;align-items:flex-end} |
|||
.sharetypecontent .f1{ color:#51c332;width:50%;height:150rpx;display:flex;flex-direction:column;align-items:center;background:#fff;font-size:28rpx;border:0} |
|||
.sharetypecontent button::after{border:0} |
|||
.sharetypecontent .f1 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .f2{ color:#51c332;width:50%;display:flex;flex-direction:column;align-items:center} |
|||
.sharetypecontent .f2 .img{width:90rpx;height:90rpx} |
|||
.sharetypecontent .t1{height:60rpx;line-height:60rpx;color:#666} |
|||
|
|||
.posterDialog{ position:fixed;z-index:9;width:100%;height:100%;background:rgba(0,0,0,0.8);top:var(--window-top);left:0} |
|||
.posterDialog .main{ width:80%;margin:60rpx 10% 30rpx 10%;background:#fff;position:relative;border-radius:20rpx} |
|||
.posterDialog .close{ position:absolute;padding:20rpx;top:0;right:0} |
|||
.posterDialog .close .img{ width:40rpx;height:40rpx;} |
|||
.posterDialog .content{ width:100%;padding:70rpx 20rpx 30rpx 20rpx;color:#333;font-size:30rpx;text-align:center} |
|||
.posterDialog .content .img{width:540rpx;height:960rpx} |
|||
</style> |
|||
@ -0,0 +1,91 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<form @submit="formSubmit" @reset="formReset" report-submit="true"> |
|||
<view class="form-item"> |
|||
<text class="label">退款原因</text> |
|||
<view class="input-item"><textarea placeholder="请输入退款原因" placeholder-style="color:#999;" name="reason"></textarea></view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<text class="label">退款金额(元)</text> |
|||
<view class="flex"><input name="money" type="digit" :value="totalprice" placeholder="请输入退款金额" placeholder-style="color:#999;"></input></view> |
|||
</view> |
|||
<button class="ref-btn" form-type="submit">确定</button> |
|||
</form> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
orderid: '', |
|||
totalprice: 0 |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.orderid = this.opt.orderid |
|||
this.totalprice = this.opt.price |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
this.loaded(); |
|||
}, |
|||
formSubmit: function (e) { |
|||
//console.log(e);return; |
|||
var that = this; |
|||
var orderid = that.orderid; |
|||
var reason = e.detail.value.reason; |
|||
var money = parseFloat(e.detail.value.money); |
|||
|
|||
if (reason == '') { |
|||
app.alert('请填写退款原因'); |
|||
return; |
|||
} |
|||
|
|||
if (money <= 0 || money > parseFloat(that.totalprice)) { |
|||
app.alert('退款金额有误'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiSeckill/refund', {orderid: orderid,reason: reason,money: money}, function (data) { |
|||
app.showLoading(false); |
|||
app.alert(data.msg); |
|||
var pages = getCurrentPages(); |
|||
|
|||
if (pages.length > 1) { |
|||
var prePage = pages[pages.length - 2]; |
|||
prePage.getdata(); |
|||
} |
|||
setTimeout(function () { |
|||
app.goback(); |
|||
}, 1000); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item{ width:100%;background: #fff; padding: 32rpx 20rpx;} |
|||
.form-item .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item .input-item{ width:100%;} |
|||
.form-item textarea{ width:100%;height:200rpx;border: 1px #eee solid;padding: 20rpx;} |
|||
.form-item input{ width:100%;border: 1px #eee solid;padding: 10rpx;height:80rpx} |
|||
.form-item .mid{ height:80rpx;line-height:80rpx;padding:0 20rpx;} |
|||
.ref-btn{ width: 90%; margin: 0 5%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 8px;border: none; background: #ff8758; } |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,196 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="search-container"> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="f1 flex-y-center"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="搜索感兴趣的视频" placeholder-style="font-size:24rpx;color:#C2C2C2" @confirm="searchConfirm"></input> |
|||
</view> |
|||
</view> |
|||
<dd-tab :itemdata="cnamelist" :itemst="cidlist" :st="st" :isfixed="false" @changetab="changetab" v-if="clist.length>0"></dd-tab> |
|||
</view> |
|||
<view class="content" :style="clist.length>0?'margin-top:190rpx':'margin-top:100rpx'"> |
|||
<block v-if="sysset.list_type == 1"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item2" @tap="goto" :data-url="'detail?id=' + item.id +'&cid='+st"> |
|||
<view class="f1"><image class="image" :src="item.coverimg" mode="widthFix"/></view> |
|||
<view class="f2"> |
|||
<view class="t1">{{item.name}}</view> |
|||
<view class="t2">{{item.description}}</view> |
|||
<view class="t3">播放量 {{item.view_num}} <text style="padding:0 20rpx">·</text> 点赞数 {{item.zan_num}}</view> |
|||
<view class="t4"><image class="touxiang" :src="item.binfo.logo"/>{{item.binfo.name}}</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<block v-else> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item" :style="index%2==0?'margin-right:2%':''"> |
|||
<image class="ff" mode="widthFix" :src="item.coverimg" @tap="goto" :data-url="'detail?id=' + item.id +'&cid='+st"></image> |
|||
<view class="f2"> |
|||
<view class="t1"><image class="touxiang" :src="item.binfo.logo"/></view> |
|||
<view class="t2"><image class="tubiao" :src="event_rul +'/static/img/static/img/shortvideo_playnum.png'"/>{{item.view_num}}</view> |
|||
<view class="t3"><image class="tubiao" :src="event_rul +'/static/img/static/img/shortvideo_likenum.png'"/>{{item.zan_num}}</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<view class="item" style="display:block" v-if="nodata"><nodata></nodata></view> |
|||
|
|||
<view v-if="sysset.can_upload==1" class="covermy" :class="menuindex>-1?'tabbarbot':'notabbarbot'" @tap="goto" data-url="uploadvideo"><image :src="pre_url+'/static/img/shortvideo_uploadbtn.png'"></image></view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt" @getmenuindex="getmenuindex"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
bid:'', |
|||
st: 'all', |
|||
keyword:'', |
|||
pagenum: 1, |
|||
clist: [], |
|||
binfo:{}, |
|||
cnamelist:[], |
|||
cidlist:[], |
|||
datalist: [], |
|||
cid: 0, |
|||
nomore: false, |
|||
nodata:false, |
|||
sysset:{}, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.st = this.opt.st || 'all'; |
|||
this.bid = this.opt.bid || ''; |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
var keyword = that.keyword; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiShortvideo/index', {bid:that.bid,cid: st,pagenum: pagenum,keyword:keyword}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1) { |
|||
that.clist = res.clist |
|||
that.sysset = res.sysset |
|||
if((res.clist).length > 0){ |
|||
var cnamelist = []; |
|||
var cidlist = []; |
|||
cnamelist.push('全部'); |
|||
cidlist.push('all'); |
|||
for(var i in that.clist){ |
|||
cnamelist.push(that.clist[i].name); |
|||
cidlist.push(that.clist[i].id); |
|||
} |
|||
that.cnamelist = cnamelist; |
|||
that.cidlist = cidlist; |
|||
} |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
changetab: function (st) { |
|||
this.st = st; |
|||
uni.pageScrollTo({ |
|||
scrollTop: 0, |
|||
duration: 0 |
|||
}); |
|||
this.getdata(); |
|||
}, |
|||
searchConfirm: function (e) { |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword |
|||
that.getdata(); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
page{background:#fff} |
|||
.search-container {position: fixed;width: 100%;background: #fff;z-index:9;top:var(--window-top)} |
|||
.topsearch{width:100%;padding:20rpx 20rpx 10rpx 20rpx;} |
|||
.topsearch .f1{height:60rpx;border-radius:30rpx;border:0;background-color:#f7f7f7;flex:1} |
|||
.topsearch .f1 .img{width:24rpx;height:24rpx;margin-left:10px} |
|||
.topsearch .f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
.navbg{text-align: center;height: 92rpx;line-height: 92rpx;font-size: 40rpx;color: #222; border-bottom: #eee 1rpx solid; background-color: #fff;} |
|||
.navbg:after {content: '';width: 160%;height:300rpx;position: absolute;left: -30%;top:0;border-radius: 0 0 50% 50%;z-index:1;} |
|||
.nav {width: 100%;position:fixed;z-index:10; top: 0; background-color: #fff;} |
|||
.nav>scroll-view {overflow: visible !important;padding-top:20rpx;padding-bottom:20rpx} |
|||
.nav .f1 {flex-grow: 0;flex-shrink: 0;display:flex;align-items:center;color:#222;position:relative;z-index:2} |
|||
.nav .f1 .item{flex-grow: 0;flex-shrink: 0;width:25%;text-align:center;padding:16rpx 0;opacity: 0.6;} |
|||
.nav .f1 .item .t1 {font-size:34rpx;font-weight:bold} |
|||
.nav .f1 .item .t2 {font-size:24rpx} |
|||
.nav .f1 .item.active {position: relative;color:#C68924;opacity:1;background-color: #FAF0E6; border-radius:20rpx ;} |
|||
|
|||
.content{width:96%;margin-left:2%;position:relative;margin-top:100rpx; display:flex;flex-wrap:wrap} |
|||
.content .item{width:49%;height:500rpx;background:#fff;overflow:hidden;border-radius:8rpx;margin-bottom:20rpx;position:relative} |
|||
.content .item .ff{width:100%;height:100%;display:block;} |
|||
.content .item .f2{position: absolute;bottom:20rpx;left:20rpx;display:flex;align-items:center;color:#fff;font-size:22rpx} |
|||
.content .item .f2 .t1{display:flex;align-items:center;text-shadow: 0px 6px 12px rgba(0, 0, 0, 0.12);} |
|||
.content .item .f2 .t2{display:flex;align-items:center;margin-left:30rpx;text-shadow: 0px 6px 12px rgba(0, 0, 0, 0.12);} |
|||
.content .item .f2 .t3{display:flex;align-items:center;margin-left:30rpx;text-shadow: 0px 6px 12px rgba(0, 0, 0, 0.12);} |
|||
.content .item .f2 .tubiao{display:block;height:28rpx;width:28rpx;margin-right:10rpx} |
|||
.content .item .f2 .touxiang{display:block;width:40rpx;height:40rpx;border-radius:50%;} |
|||
|
|||
.content .item2{width:100%;background:#fff;display:flex;padding:20rpx 0;border-bottom:1px solid #f5f5f5} |
|||
.content .item2 .f1 {width:30%;height:0;overflow:hidden;background: #ffffff;padding-bottom:40%;position: relative;border-radius:4rpx;} |
|||
.content .item2 .f1 .image{position:absolute;top:0;left:0;width: 100%;height:auto} |
|||
.content .item2 .f2 {width: 70%;padding:6rpx 10rpx 5rpx 20rpx;position: relative;} |
|||
.content .item2 .f2 .t1 {color:#222222;font-weight:bold;font-size:30rpx;line-height:40rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.content .item2 .f2 .t2 {color:#666;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.content .item2 .f2 .t3{color:#222;font-size:22rpx;color:#9C9C9C;margin-top:20rpx;} |
|||
.content .item2 .f2 .t4{display:flex;align-items:center;color:#515254;font-size:24rpx;position:absolute;bottom:10rpx;} |
|||
.content .item2 .f2 .t4 .touxiang{display:block;width:30rpx;height:30rpx;border-radius:50%;margin-right:10rpx;} |
|||
|
|||
.covermy{position:fixed;z-index:99999;bottom:0;right:0;width:150rpx;height:150rpx;box-sizing:content-box} |
|||
.covermy image{width:100%;height:100%} |
|||
</style> |
|||
@ -0,0 +1,164 @@ |
|||
<template> |
|||
<view> |
|||
<dd-search :isfixed="true" @getdata="getdata"></dd-search> |
|||
<view class="container" id="datalist"> |
|||
<block v-for="(item, index) in datalist" :key="index"> |
|||
<view class="order-box"> |
|||
<view class="content" style="border-bottom:none"> |
|||
<view @tap="goto" :data-url="'detail?id=' + item.id"> |
|||
<image :src="item.coverimg"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{item.name}}</text> |
|||
<text class="t2">播放量 {{item.view_num}}<text style="color:#a88;padding-left:20rpx">点赞数 {{item.zan_num}}</text></text> |
|||
<text class="t3" v-if="item.status==2">驳回原因:{{item.reason}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="op"> |
|||
<text style="color:orange" class="flex1" v-if="item.status==0">待审核</text> |
|||
<text style="color:red" class="flex1" v-if="item.status==2">未通过</text> |
|||
<text style="color:green" class="flex1" v-if="item.status==1">已通过</text> |
|||
<view class="btn2" @tap="todel" :data-id="item.id">删除</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
|
|||
<view style="height:140rpx"></view> |
|||
<view class="btn-add" :class="menuindex>-1?'tabbarbot':'notabbarbot3'" :style="'background:linear-gradient(90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'" @tap="goto" data-url="uploadvideo"><image :src="event_rul +'/static/img/static/img/add.png'" style="width:28rpx;height:28rpx;margin-right:6rpx"/>发布短视频</view> |
|||
|
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
st: 'all', |
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
count0: 0, |
|||
count1: 0, |
|||
countall: 0, |
|||
sclist: "", |
|||
keyword: '', |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
changetab: function (st) { |
|||
var that = this; |
|||
that.st = st; |
|||
that.getdata(); |
|||
}, |
|||
getdata: function (loadmore,keyword) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
var st = that.st; |
|||
if(typeof keyword =='undefined') { |
|||
keyword = that.keyword; |
|||
} else { |
|||
that.keyword = keyword; |
|||
} |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
that.loading = true; |
|||
app.post('ApiShortvideo/myupload', {keyword:keyword,pagenum: pagenum,st: that.st}, function (res) { |
|||
that.loading = false; |
|||
var data = res.datalist; |
|||
if (pagenum == 1){ |
|||
that.countall = res.countall; |
|||
that.count0 = res.count0; |
|||
that.count1 = res.count1; |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该商品吗?', function () { |
|||
app.post('ApiShortvideo/myuploaddel', {id: id}, function (res) { |
|||
if (res.status == 1) { |
|||
app.success(res.msg); |
|||
that.getdata(); |
|||
} else { |
|||
app.error(res.msg); |
|||
} |
|||
}); |
|||
}); |
|||
}, |
|||
setst: function (e) { |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var st = e.currentTarget.dataset.st; |
|||
app.confirm('确定要' + (st == 0 ? '下架' : '上架') + '吗?', function () { |
|||
app.post('ApiShortvideo/setst', {st: st,id: id}, function (res) { |
|||
if (res.status == 1) { |
|||
app.success(res.msg); |
|||
that.getdata(); |
|||
} else { |
|||
app.error(res.msg); |
|||
} |
|||
}); |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{ width:100%;margin-top:106rpx} |
|||
.order-box{ width: 94%;margin:0 3%;padding:3px 3%; background: #fff; margin-bottom:12rpx;border-radius:16rpx} |
|||
.order-box .content{display:flex;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;position:relative} |
|||
.order-box .content:last-child{ border-bottom: 0; } |
|||
.order-box .content image{ width: 140rpx; height: 140rpx;} |
|||
.order-box .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.order-box .content .detail .t1{font-size:26rpx;min-height:50rpx;line-height:36rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.order-box .content .detail .t2{height:36rpx;line-height:36rpx;color: #999;overflow: hidden;font-size: 24rpx;} |
|||
.order-box .content .detail .t3{display:flex;height: 36rpx;line-height: 36rpx;color: #ff4246;font-size: 24rpx;} |
|||
.order-box .content .detail .x1{ font-size:30rpx;margin-right:5px} |
|||
.order-box .content .detail .x2{ font-size:24rpx;text-decoration:line-through;color:#999} |
|||
|
|||
.order-box .bottom{ width:100%; padding:10rpx 0px; border-top: 1px #e5e5e5 solid; color: #555;} |
|||
.order-box .op{ display:flex;align-items:center;width:100%; padding:10rpx 0px; border-top: 1px #e5e5e5 solid; color: #555;} |
|||
.btn1{margin-left:20rpx;width:120rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:120rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
|
|||
.btn-add{width:90%;max-width:700px;margin:0 auto;height:96rpx;line-height:96rpx;text-align:center;color:#fff;font-size:30rpx;font-weight:bold;border-radius:40rpx;position: fixed;left:0px;right:0;bottom:0;margin-bottom:20rpx;} |
|||
</style> |
|||
@ -0,0 +1,244 @@ |
|||
<template> |
|||
<view> |
|||
<block v-if="isload"> |
|||
<form @submit="formsubmit"> |
|||
<view class="st_box"> |
|||
<view class="st_form"> |
|||
<view v-if="cateArr"> |
|||
<picker @change="cateChange" :value="cindex" :range="cateArr" style="height:80rpx;line-height:80rpx;border-bottom:1px solid #EEEEEE;font-size:18px"> |
|||
<view class="picker">{{cindex==-1? '请选择类型' : cateArr[cindex]}}</view> |
|||
</picker> |
|||
</view> |
|||
<!-- <view v-if="cateArr"> |
|||
<picker @change="cateChange" :value="cindex" :range="cateArr" style="height:80rpx;line-height:80rpx;border-bottom:1px solid #EEEEEE;font-size:18px"> |
|||
<view class="picker">{{cindex==-1? '请选择曝光标签' : cateArr[cindex]}}</view> |
|||
</picker> |
|||
</view> --> |
|||
<view><input placeholder="输入标题" name="title" maxlength="-1"/></view> |
|||
<view><textarea placeholder="输入简介" name="content" maxlength="-1" style="height:100rpx;"></textarea></view> |
|||
<view class="uploadbtn_ziti1">上传封面</view> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx;"> |
|||
<view v-for="(item, index) in pics" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="pics"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" @tap="xuanzhuan" :data-index="index" data-field="pics"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="pics" v-if="pics.length<1"> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<input type="text" hidden="true" name="pics" :value="pics.join(',')" maxlength="-1"></input> |
|||
|
|||
<view class="uploadbtn_ziti2">上传短视频</view> |
|||
<view class="flex-y-center" style="width:100%;padding:20rpx 0;margin-top:20rpx;"> |
|||
<image :src="event_rul +'/static/img/static/img/uploadvideo.png'" style="width:200rpx;height:200rpx;background:#eee;" @tap="uploadvideo"></image><text v-if="video" style="padding-left:20rpx;color:#333">已上传短视频</text></view> |
|||
<input type="text" hidden="true" name="video" :value="video" maxlength="-1"></input> |
|||
</view> |
|||
</view> |
|||
<view class="st_button flex-y-center"> |
|||
<button form-type="submit" :style="{background:t('color1')}">发表</button> |
|||
</view> |
|||
<view style="width:100%;margin-top:40rpx;text-align:center;color:#999;display:flex;align-items:center;justify-content:center" @tap="goto" data-url="myupload">我的发表记录<image :src="event_rul +'/static/img/static/img/arrowright.png'" style="width:30rpx;height:30rpx"/></view> |
|||
<view style="width:100%;height:60rpx"></view> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
datalist: [], |
|||
content_pic: [], |
|||
pagenum: 1, |
|||
cateArr: [], |
|||
cindex: -1, |
|||
pics:[], |
|||
video: '', |
|||
sysset:{}, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiShortvideo/uploadvideo', {}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg); |
|||
return; |
|||
} |
|||
that.clist = res.clist; |
|||
that.sysset = res.sysset; |
|||
var clist = res.clist; |
|||
if (clist.length > 0) { |
|||
var cateArr = []; |
|||
for (var i in clist) { |
|||
if (that.opt && that.opt.cid == clist[i].id) { |
|||
that.cindex = i; |
|||
} |
|||
cateArr.push(clist[i].name); |
|||
} |
|||
} else { |
|||
cateArr = false; |
|||
} |
|||
that.cateArr = cateArr |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
cateChange: function (e) { |
|||
this.cindex = e.detail.value; |
|||
}, |
|||
formsubmit: function (e) { |
|||
var that = this; |
|||
console.log(e); |
|||
var clist = that.clist; |
|||
if (clist.length > 0) { |
|||
if (that.cindex == -1) { |
|||
app.error('请选择分类'); |
|||
return false; |
|||
} |
|||
var cid = clist[that.cindex].id; |
|||
} else { |
|||
var cid = 0; |
|||
} |
|||
var formdata = e.detail.value; |
|||
var title = formdata.title; |
|||
if (title == '') { |
|||
app.error('请输入标题'); |
|||
return false; |
|||
} |
|||
var content = formdata.content; |
|||
var pics = formdata.pics; |
|||
var video = formdata.video; |
|||
if (pics == '') { |
|||
app.error('请上传封面'); |
|||
return false; |
|||
} |
|||
if (video == '') { |
|||
app.error('请上传短视频'); |
|||
return false; |
|||
} |
|||
app.post('ApiShortvideo/uploadvideo', {title:title,cid: cid,pics: pics,content: content,video: video}, function (res) { |
|||
app.showLoading(false); |
|||
if (res.status == 1) { |
|||
app.success(res.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 1000); |
|||
} else { |
|||
app.error(res.msg); |
|||
} |
|||
}); |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pic') that.pic = pics; |
|||
if(field == 'pics') that.pics = pics; |
|||
if(field == 'zhengming') that.zhengming = pics; |
|||
},1) |
|||
}, |
|||
uploadvideo: function () { |
|||
var that = this; |
|||
//var maxDuration = that.sysset.upload_maxduration; |
|||
//if(!maxDuration) maxDuration = 999999; |
|||
var maxsize = that.sysset.upload_maxsize; |
|||
if(!maxsize) maxsize = 999999999999999; |
|||
uni.chooseVideo({ |
|||
sourceType: ['album', 'camera'], |
|||
//maxDuration: maxDuration, |
|||
success: function (res) { |
|||
var tempFilePath = res.tempFilePath; |
|||
var size = res.size; |
|||
if(size > maxsize * 1024){ |
|||
app.alert('短视频文件过大');return; |
|||
} |
|||
//console.log(size);return; |
|||
app.showLoading('上传中'); |
|||
uni.uploadFile({ |
|||
url: app.globalData.baseurl + 'ApiImageupload/uploadImg/aid/' + app.globalData.aid + '/platform/' + app.globalData.platform + '/session_id/' + app.globalData.session_id, |
|||
filePath: tempFilePath, |
|||
name: 'file', |
|||
success: function (res) { |
|||
app.showLoading(false); |
|||
var data = JSON.parse(res.data); |
|||
|
|||
if (data.status == 1) { |
|||
that.video = data.url; |
|||
} else { |
|||
app.alert(data.msg); |
|||
} |
|||
}, |
|||
fail: function (res) { |
|||
app.showLoading(false); |
|||
app.alert(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
fail: function (res) { |
|||
console.log(res); //alert(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
removeimg:function(e){ |
|||
var that = this; |
|||
var index= e.currentTarget.dataset.index |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
pics.splice(index,1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
page{background:#f7f7f7} |
|||
.st_box{ padding:0rpx 0 } |
|||
.st_button{ display: flex; justify-content: space-between;padding:24rpx 24rpx 10rpx 24rpx;} |
|||
.st_button button{background: #1658c6;border-radius:6rpx;border: none;padding:0 20rpx;color: #fff;font-size:36rpx;text-align: center;width:100%;display: flex;height:100rpx;justify-content: center;align-items: center;} |
|||
|
|||
.st_form{ padding: 24rpx;background: #ffffff;margin: 10px;border-radius: 15px;} |
|||
.st_form input{ width: 100%;height: 120rpx; border: none;border-bottom:1px solid #EEEEEE;} |
|||
.st_form input::-webkit-input-placeholder { /* WebKit browsers */ color: #BBBBBB; font-size: 24rpx} |
|||
.st_form textarea{ width:100%;min-height:200rpx;padding:20rpx 0;border: none;border-bottom:1px solid #EEEEEE;} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;z-index:90;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
.uploadbtn_ziti1{height:30rpx; line-height: 30rpx;font-size:30rpx; margin-top: 20rpx;} |
|||
.uploadbtn_ziti2{height:30rpx; line-height: 30rpx;font-size:30rpx; padding-top: 20rpx; margin-top: 20rpx;border-top:1px solid #EEEEEE;} |
|||
</style> |
|||
@ -0,0 +1,190 @@ |
|||
<template> |
|||
<view class="container" style="padding:20rpx 0" :style="{background:toupiao.color1}"> |
|||
<block v-if="isload"> |
|||
<view style="color:red;padding:30rpx 30rpx;margin-top:20rpx;background:#fff;margin:0 28rpx;border-radius:8rpx" v-if="info.id && info.status==2">审核不通过:{{info.reason}},请修改后再提交</view> |
|||
<view style="color:red;padding:30rpx 30rpx;margin-top:20rpx;background:#fff;margin:0 28rpx;border-radius:8rpx" v-if="info.id && info.status==1">您已成功参与报名</view> |
|||
<view style="color:green;padding:30rpx 30rpx;margin-top:20rpx;background:#fff;margin:0 28rpx;border-radius:8rpx" v-if="info.id && info.status==0">您已提交申请,请等待审核</view> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
|
|||
|
|||
<view class="apply_box"> |
|||
<view class="apply_item"> |
|||
<view>名称<text style="color:red"> *</text></view> |
|||
<view class="flex-y-center"><input type="text" name="name" :value="info.name" placeholder="请输入选手名称"/></view> |
|||
</view> |
|||
<view class="apply_item"> |
|||
<view>联系方式<text style="color:red"> *</text></view> |
|||
<view class="flex-y-center"><input type="text" name="weixin" :value="info.weixin" placeholder="请输入联系方式"></input></view> |
|||
</view> |
|||
</view> |
|||
<view class="apply_box"> |
|||
<view class="apply_item" style="border-bottom:0"><text>首图<text style="color:red"> *</text></text></view> |
|||
<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;"> |
|||
<view v-if="pic" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removepic"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="pic" @tap="previewImage" :data-url="pic" mode="widthFix"></image></view> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadpic" v-if="!pic"></view> |
|||
<input type="text" hidden="true" name="pic" :value="pic" maxlength="-1"></input> |
|||
</view> |
|||
</view> |
|||
<view class="apply_box"> |
|||
<view class="apply_item" style="border-bottom:0"><text>详情图片</text></view> |
|||
<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;"> |
|||
<view v-for="(item, index) in pics" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="pics"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="pics"></view> |
|||
<input type="text" hidden="true" name="pics" :value="pics.join(',')" maxlength="-1"></input> |
|||
</view> |
|||
</view> |
|||
<view class="apply_box" style="padding-bottom:20rpx"> |
|||
<view class="apply_item flex-col"> |
|||
<view><text class="title">详情文字</text></view> |
|||
<view class="flex-y-center"><textarea type="text" name="detail_txt" :value="info.detail_txt" placeholder="请输入详情文字~" placeholder-style="font-size:24rpx" style="height:100rpx;background:#F8F8F8;padding:10rpx 20rpx" maxlength="-1"></textarea></view> |
|||
</view> |
|||
</view> |
|||
<button class="set-btn" form-type="submit" :style="{color:toupiao.color2}" v-if="!info.id || info.status==2">提 交</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
pre_url:app.globalData.pre_url, |
|||
|
|||
pic:'', |
|||
pics:[], |
|||
info:{}, |
|||
toupiao:{}, |
|||
headimg:[], |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata:function(){ |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiToupiao/baoming', {id:that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.info = res.info; |
|||
that.toupiao = res.toupiao; |
|||
|
|||
var pics = res.info ? res.info.pics : ''; |
|||
if (pics) { |
|||
pics = pics.split(','); |
|||
} else { |
|||
pics = []; |
|||
} |
|||
that.pics = pics; |
|||
|
|||
that.pic = res.info.pic ? res.info.pic : ''; |
|||
|
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var formdata = e.detail.value; |
|||
formdata.id = that.opt.id; |
|||
if (formdata.name == '') { |
|||
app.alert('请输入名称');return; |
|||
} |
|||
if (formdata.weixin == '') { |
|||
app.alert('请输入联系方式');return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post("ApiToupiao/baoming",formdata, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 1) { |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goto('index?id='+that.opt.id); |
|||
}, 1000); |
|||
} else { |
|||
app.error(data.msg); |
|||
} |
|||
}); |
|||
}, |
|||
uploadpic:function(e){ |
|||
var that = this; |
|||
app.chooseImage(function(urls){ |
|||
that.pic = urls[0]; |
|||
},1) |
|||
}, |
|||
removepic:function(e){ |
|||
var that = this; |
|||
that.pic = ''; |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pics') that.pics = pics; |
|||
},1) |
|||
}, |
|||
removeimg:function(e){ |
|||
var that = this; |
|||
var index= e.currentTarget.dataset.index |
|||
var field= e.currentTarget.dataset.field |
|||
if(field == 'pics'){ |
|||
var pics = that.pics |
|||
pics.splice(index,1); |
|||
that.pics = pics; |
|||
} |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
radio{transform: scale(0.6);} |
|||
checkbox{transform: scale(0.6);} |
|||
.apply_box{ padding:2rpx 24rpx 0 24rpx; background: #fff;margin: 24rpx;border-radius: 10rpx} |
|||
.apply_title { background: #fff} |
|||
.apply_title .qr_goback{ width:18rpx;height:32rpx; margin-left:24rpx; margin-top: 34rpx;} |
|||
.apply_title .qr_title{ font-size: 36rpx; color: #242424; font-weight:bold;margin: 0 auto; line-height: 100rpx;} |
|||
|
|||
.apply_item{ line-height: 100rpx; display: flex;justify-content: space-between;border-bottom:1px solid #eee } |
|||
.apply_box .apply_item:last-child{ border:none} |
|||
.apply_item input{ width: 100%; border: none;color:#111;font-size:28rpx; text-align: right} |
|||
.apply_item input::placeholder{ color:#999999} |
|||
.apply_item textarea{ width:100%;min-height:200rpx;padding:20rpx 0;border: none;} |
|||
.apply_item .upload_pic{ margin:50rpx 0;background: #F3F3F3;width:90rpx;height:90rpx; text-align: center } |
|||
.apply_item .upload_pic image{ width: 32rpx;height: 32rpx; } |
|||
.set-btn{width: 90%;margin:0 5%;height:96rpx;line-height:96rpx;border-radius:48rpx;color:#FFFFFF;font-size:30rpx;font-weight:bold;background:#fff} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;z-index:90;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,313 @@ |
|||
<template> |
|||
<view class="container" :style="{background:info.color1}"> |
|||
<block v-if="isload"> |
|||
<view class="topbannerbg" :style="detail.pic?'background:url('+detail.pic+') 100%;background-size:100%':''"></view> |
|||
<view class="topbannerbg2" :style="{background:'linear-gradient(rgba('+info.color1rgb+',0.8) 0%,'+info.color1+' 50%)'}"></view> |
|||
|
|||
<view class="box1"> |
|||
<view class="f1"> |
|||
<image :src="detail.pic"></image> |
|||
<view class="t1">{{detail.name}}</view> |
|||
</view> |
|||
<view class="f2"> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{detail.number}}</view><view class="t2">编号</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{detail.helpnum}}</view><view class="t2">得票数</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{detail.mingci}}</view><view class="t2">当前排名</view></view> |
|||
</view> |
|||
|
|||
<view class="f3"> |
|||
<image :src="event_rul +'/static/img/static/img/clock.png'" style="width:32rpx;height:32rpx;margin-right:6rpx"/> |
|||
<text>{{ info.starttime > nowtime ? '距活动开始还有' : '距活动结束还剩'}}</text> |
|||
</view> |
|||
<view class="f4" :style="{color:info.color2}"> |
|||
<text class="t1">{{djsday}}</text><text class="t2">天</text><text class="t1">{{djshour}}</text><text class="t2">小时</text><text class="t1">{{djsmin}}</text><text class="t2">分钟</text><text class="t1">{{djssec}}</text><text class="t2">秒</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="box2"> |
|||
<view style="width:100%;"> |
|||
<block v-for="(item,index) in detail.pics"> |
|||
<image :src="item" style="width:100%;" mode="widthFix"/> |
|||
</block> |
|||
</view> |
|||
<view style="width:100%;text-align:left;white-space:pre-wrap;margin-top:10rpx;font-size:32rpx">{{detail.detail_txt}}</view> |
|||
<parse :content="detail.detail" /> |
|||
</view> |
|||
<view style="width:100%;height:160rpx"></view> |
|||
<view class="footer"> |
|||
<view class="btn1" :style="{background:'rgba('+info.color2rgb+',0.12)',color:info.color2}" v-if="info.canapply==1" @tap="goto" :data-url="'baoming?id='+info.id">我要报名</view> |
|||
<view class="btn2" :style="{background:info.color2}" @tap="toupiao" :data-id="detail.id" data-type="0">{{info.helptext}}</view> |
|||
</view> |
|||
|
|||
|
|||
<uni-popup id="dialogCaptcha" ref="dialogCaptcha" type="dialog" v-if="info.help_check == 1"> |
|||
<view class="hxqrbox"> |
|||
<view class="hxqrbox1"> |
|||
<input type="text" placeholder="请输入验证码" @input="setcaptcha"/> |
|||
<image @tap="regetcaptcha" :src="pre_url+'/?s=/ApiIndex/captcha&aid='+aid+'&session_id='+session_id+'&t='+randt"/> |
|||
</view> |
|||
<view class="tou2" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap="toupiao" :data-id="nowjoinid" data-type="1">确 定</view> |
|||
<view class="close" @tap="closeCaptcha"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
<uni-popup id="dialogSmscode" ref="dialogSmscode" type="dialog" v-if="info.help_check == 2"> |
|||
<view class="hxqrbox"> |
|||
<view class="hxqrbox1"> |
|||
<image :src="event_rul +'/static/img/static/img/reg-tel.png'" style="width:44rpx;height:44rpx;margin-right:30rpx"/> |
|||
<input type="text" placeholder="请输入手机号" @input="setsmstel"/> |
|||
<view class="code" :style="{color:t('color1')}" @tap="sendsmscode" style="font-size:30rpx;width:160rpx;text-align:center">{{smsdjs||'获取验证码'}}</view> |
|||
</view> |
|||
<view class="hxqrbox1" style="margin-top:40rpx"> |
|||
<image :src="event_rul +'/static/img/static/img/reg-code.png'" style="width:44rpx;height:44rpx;margin-right:30rpx"/> |
|||
<input type="text" placeholder="请输入短信验证码" @input="setsmscode"/> |
|||
</view> |
|||
<view class="tou2" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap="toupiao" :data-id="nowjoinid" data-type="1">确 定</view> |
|||
<view class="close" @tap="closeSmscode"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
info: {}, |
|||
detail:{}, |
|||
|
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
aid:app.globalData.aid, |
|||
session_id:app.globalData.session_id, |
|||
captcha:'', |
|||
randt:'', |
|||
nowjoinid:0, |
|||
smscode:'', |
|||
smsdjs: '', |
|||
smstel:'', |
|||
hqing: 0, |
|||
|
|||
nowtime:0, |
|||
djsday: '00', |
|||
djshour: '00', |
|||
djsmin: '00', |
|||
djssec: '00', |
|||
keyword:'', |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
onShareAppMessage: function () { |
|||
var that = this; |
|||
var title = that.detail.name + ' - ' + (that.info.sharetitle ? that.info.sharetitle : that.info.name); |
|||
var sharepic = that.detail.pic; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
return this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var that = this; |
|||
var title = that.detail.name + ' - ' + (that.info.sharetitle ? that.info.sharetitle : that.info.name); |
|||
var sharepic = that.detail.pic; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
var sharewxdata = this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.post('ApiToupiao/detail', {id:that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.info = res.info; |
|||
that.detail = res.detail; |
|||
that.nowtime = res.nowtime; |
|||
uni.setNavigationBarTitle({ |
|||
title: that.info.name |
|||
}); |
|||
var title = that.detail.name + ' - ' + (that.info.sharetitle ? that.info.sharetitle : that.info.name); |
|||
var sharepic = that.detail.pic; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
that.loaded({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
|
|||
clearInterval(interval); |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
if (that.info.starttime * 1 > that.nowtime * 1) { |
|||
var totalsec = that.info.starttime * 1 - that.nowtime * 1; |
|||
} else { |
|||
var totalsec = that.info.endtime * 1 - that.nowtime * 1; |
|||
} |
|||
if (totalsec <= 0) { |
|||
that.djsday = '00'; |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djsday = (date < 10 ? '0' : '') + date; |
|||
var djshour = (houer < 10 ? '0' : '') + houer; |
|||
var djsmin = (min < 10 ? '0' : '') + min; |
|||
var djssec = (sec < 10 ? '0' : '') + sec; |
|||
that.djsday = djsday; |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
regetcaptcha:function(){ |
|||
this.randt = this.randt+'1'; |
|||
}, |
|||
setcaptcha:function(e){ |
|||
this.captcha = e.detail.value; |
|||
}, |
|||
setsmscode:function(e){ |
|||
this.smscode = e.detail.value; |
|||
}, |
|||
setsmstel:function(e){ |
|||
this.smstel = e.detail.value; |
|||
}, |
|||
sendsmscode: function () { |
|||
var that = this; |
|||
if (that.hqing == 1) return; |
|||
that.hqing = 1; |
|||
var smstel = that.smstel; |
|||
if (smstel == '') { |
|||
app.alert('请输入手机号码'); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
if (!/^1[3456789]\d{9}$/.test(smstel)) { |
|||
app.alert("手机号码有误,请重填"); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
app.post("ApiIndex/sendsms", {tel: smstel}, function (data) { |
|||
if (data.status != 1) { |
|||
app.alert(data.msg);return; |
|||
} |
|||
}); |
|||
var time = 120; |
|||
var interval1 = setInterval(function () { |
|||
time--; |
|||
if (time < 0) { |
|||
that.smsdjs = '重新获取'; |
|||
that.hqing = 0; |
|||
clearInterval(interval1); |
|||
} else if (time >= 0) { |
|||
that.smsdjs = time + '秒'; |
|||
} |
|||
}, 1000); |
|||
}, |
|||
closeCaptcha:function(){ |
|||
this.$refs.dialogCaptcha.close(); |
|||
}, |
|||
closeSmscode:function(){ |
|||
this.$refs.dialogSmscode.close(); |
|||
}, |
|||
toupiao:function(e){ |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var type = e.currentTarget.dataset.type; |
|||
if(type == 0 && that.info.help_check == 1){ |
|||
this.nowjoinid = id; |
|||
this.$refs.dialogCaptcha.open(); |
|||
return; |
|||
} |
|||
if(type == 0 && that.info.help_check == 2){ |
|||
this.nowjoinid = id; |
|||
this.$refs.dialogSmscode.open(); |
|||
return; |
|||
} |
|||
app.showLoading('投票中'); |
|||
app.post('ApiToupiao/toupiao',{id:id,captcha:that.captcha,smstel:that.smstel,smscode:that.smscode},function(res){ |
|||
app.showLoading(false); |
|||
if(res.status==1){ |
|||
app.success(res.msg); |
|||
that.detail.helpnum++ |
|||
if(type == 1 && that.info.help_check == 1){ |
|||
that.$refs.dialogCaptcha.close(); |
|||
} |
|||
if(type == 1 && that.info.help_check == 2){ |
|||
that.$refs.dialogSmscode.close(); |
|||
} |
|||
}else{ |
|||
app.alert(res.msg); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.topbannerbg{width:100%;height:750rpx;background:#fff;position:relative;} |
|||
.topbannerbg2{position:absolute;z-index:7;width:100%;height:750rpx;top:0;} |
|||
|
|||
.box1{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:60rpx 10rpx;display:flex;flex-direction:column;align-items:center;position:relative;z-index:12;margin-top:-400rpx} |
|||
.box1 .f1{display:flex;flex-direction:column;align-items:center;margin-top:-200rpx;margin-bottom:40rpx} |
|||
.box1 .f1 image{width:320rpx;height:320rpx;border-radius:16rpx} |
|||
.box1 .f1 .t1{color:#222222;font-size:36rpx;font-weight:bold;height:100rpx;line-height:100rpx} |
|||
.box1 .f2{display:flex;align-items:center;width:100%} |
|||
.box1 .f2 .item{flex:1;display:flex;flex-direction:column;align-items:center;} |
|||
.box1 .f2 .item .t1{font-size:48rpx;font-weight:bold;} |
|||
.box1 .f2 .item .t2{font-size:24rpx;color:#778899;margin-top:10rpx} |
|||
.box1 .f3{display:flex;align-items:center;color:#222222;margin-top:60rpx} |
|||
.box1 .f4{display:flex;align-items:flex-end;color:#222222;margin-top:20rpx;font-size:24rpx} |
|||
.box1 .f4 .t1{font-size:48rpx;font-weight:bold;padding:0 12rpx} |
|||
.box1 .f4 .t2{color:#222222;height:48rpx;line-height:48rpx} |
|||
|
|||
.box2{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:20rpx 20rpx;display:flex;flex-direction:column;align-items:center;position:relative;z-index:12;margin-top:20rpx} |
|||
|
|||
.footer{width:100%;position:fixed;bottom:0;height:132rpx;border-top:1px solid #eeeeee;z-index:14;background:#fff;display:flex;align-items:center;justify-content:center;padding:0 30rpx} |
|||
.footer .btn1{width:270rpx;height:88rpx;line-height:88rpx;border-radius:8rpx;text-align:center;margin-right:20rpx;} |
|||
.footer .btn2{flex:1;height:88rpx;line-height:88rpx;border-radius:8rpx;text-align:center;color:#fff} |
|||
|
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .hxqrbox1{display:flex;align-items:center} |
|||
.hxqrbox .hxqrbox1 input{width:270rpx;} |
|||
.hxqrbox .hxqrbox1 image{width:210rpx;height:70rpx} |
|||
.hxqrbox .tou2{border-radius:24rpx;font-size:32rpx;color:#fff;height:80rpx;line-height:80rpx;padding:0 20rpx;text-align:center;margin-top:60rpx} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,380 @@ |
|||
<template> |
|||
<view class="container" :style="{background:info.color1}"> |
|||
<block v-if="isload"> |
|||
<view class="banner"><image :src="info.banner" mode="widthFix"></image></view> |
|||
<view class="box1"> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.joinnum}}</view><view class="t2">参与人数</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.helpnum}}</view><view class="t2">累计投票</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.readcount}}</view><view class="t2">访问次数</view></view> |
|||
</view> |
|||
<view class="box2"> |
|||
<view class="f1"> |
|||
<image :src="event_rul +'/static/img/static/img/clock.png'" style="width:32rpx;height:32rpx;margin-right:6rpx"/> |
|||
<text>{{ info.starttime > nowtime ? '距活动开始还有' : '距活动结束还剩'}}</text> |
|||
</view> |
|||
<view class="f2" :style="{color:info.color2}"> |
|||
<text class="t1">{{djsday}}</text><text class="t2">天</text><text class="t1">{{djshour}}</text><text class="t2">小时</text><text class="t1">{{djsmin}}</text><text class="t2">分钟</text><text class="t1">{{djssec}}</text><text class="t2">秒</text> |
|||
</view> |
|||
<view class="topsearch flex-y-center"> |
|||
<view class="topsearch-f1 flex-y-center"> |
|||
<image class="img" :src="event_rul +'/static/img/static/img/search_ico.png'"></image> |
|||
<input :value="keyword" placeholder="搜索编号或选手名称" placeholder-style="font-size:24rpx;color:#778899" @confirm="searchConfirm"></input> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="box3"> |
|||
<block v-for="(item,index) in datalist"> |
|||
|
|||
<view v-if="info.listtype==0" class="item" @tap="goto" :data-url="'detail?id='+item.id"> |
|||
<view class="pic"><image :src="item.pic" class="img" mode="widthFix"/></view> |
|||
<view class="name">{{item.name}}</view> |
|||
<view class="no">NO: {{item.number}}</view> |
|||
<view class="helpnum">{{item.helpnum}}票</view> |
|||
<view class="tou" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap.stop="toupiao" :data-id="item.id" data-type="0">{{info.helptext}}</view> |
|||
</view> |
|||
|
|||
<view v-if="info.listtype==1" class="itemlist" @tap="goto" :data-url="'detail?id='+item.id"> |
|||
<view class="pic"><image :src="item.pic" class="img" mode="widthFix"/></view> |
|||
<view class="right"> |
|||
<view class="name">{{item.name}}</view> |
|||
<view class="no">NO: {{item.number}}</view> |
|||
<view class="helpnum">{{item.helpnum}}票</view> |
|||
<view class="tou" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap.stop="toupiao" :data-id="item.id" data-type="0">{{info.helptext}}</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</block> |
|||
</view> |
|||
<view style="background:#fff;width:94%;margin:0 3%;border-radius:12rpx" v-if="nodata"><nodata></nodata></view> |
|||
<view style="width:100%;height:60rpx"></view> |
|||
|
|||
|
|||
<uni-popup id="dialogCaptcha" ref="dialogCaptcha" type="dialog" v-if="info.help_check == 1"> |
|||
<view class="hxqrbox"> |
|||
<view class="hxqrbox1"> |
|||
<input type="text" placeholder="请输入验证码" @input="setcaptcha"/> |
|||
<image @tap="regetcaptcha" :src="pre_url+'/?s=/ApiIndex/captcha&aid='+aid+'&session_id='+session_id+'&t='+randt"/> |
|||
</view> |
|||
<view class="tou2" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap="toupiao" :data-id="nowjoinid" data-type="1">确 定</view> |
|||
<view class="close" @tap="closeCaptcha"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
<uni-popup id="dialogSmscode" ref="dialogSmscode" type="dialog" v-if="info.help_check == 2"> |
|||
<view class="hxqrbox"> |
|||
<view class="hxqrbox1"> |
|||
<image :src="event_rul +'/static/img/static/img/reg-tel.png'" style="width:44rpx;height:44rpx;margin-right:30rpx"/> |
|||
<input type="text" placeholder="请输入手机号" @input="setsmstel"/> |
|||
<view class="code" :style="{color:t('color1')}" @tap="sendsmscode" style="font-size:30rpx;width:160rpx;text-align:center">{{smsdjs||'获取验证码'}}</view> |
|||
</view> |
|||
<view class="hxqrbox1" style="margin-top:40rpx"> |
|||
<image :src="event_rul +'/static/img/static/img/reg-code.png'" style="width:44rpx;height:44rpx;margin-right:30rpx"/> |
|||
<input type="text" placeholder="请输入短信验证码" @input="setsmscode"/> |
|||
</view> |
|||
<view class="tou2" :style="{background:'linear-gradient(90deg,'+info.color2+' 0%,rgba('+info.color2rgb+',0.7) 100%)'}" @tap="toupiao" :data-id="nowjoinid" data-type="1">确 定</view> |
|||
<view class="close" @tap="closeSmscode"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
aid:app.globalData.aid, |
|||
session_id:app.globalData.session_id, |
|||
captcha:'', |
|||
randt:'', |
|||
nowjoinid:0, |
|||
smscode:'', |
|||
smsdjs: '', |
|||
smstel:'', |
|||
hqing: 0, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
|
|||
info: {}, |
|||
nowtime:0, |
|||
djsday: '00', |
|||
djshour: '00', |
|||
djsmin: '00', |
|||
djssec: '00', |
|||
keyword:'', |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
return; |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
onUnload: function (loadmore) { |
|||
clearInterval(interval); |
|||
}, |
|||
onShareAppMessage: function () { |
|||
var that = this; |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
return this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var that = this; |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
var sharewxdata = this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiToupiao/index', {id:that.opt.id,pagenum:pagenum,keyword:that.keyword}, function (res) { |
|||
that.loading = false; |
|||
|
|||
if (pagenum == 1) { |
|||
that.datalist = res.datalist; |
|||
if ((that.datalist).length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.info = res.info; |
|||
that.nowtime = res.nowtime; |
|||
uni.setNavigationBarTitle({ |
|||
title: that.info.name |
|||
}); |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
that.loaded({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
|
|||
clearInterval(interval); |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
}else{ |
|||
if ((res.datalist).length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(res.datalist); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
if (that.info.starttime * 1 > that.nowtime * 1) { |
|||
var totalsec = that.info.starttime * 1 - that.nowtime * 1; |
|||
} else { |
|||
var totalsec = that.info.endtime * 1 - that.nowtime * 1; |
|||
} |
|||
if (totalsec <= 0) { |
|||
that.djsday = '00'; |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djsday = (date < 10 ? '0' : '') + date; |
|||
var djshour = (houer < 10 ? '0' : '') + houer; |
|||
var djsmin = (min < 10 ? '0' : '') + min; |
|||
var djssec = (sec < 10 ? '0' : '') + sec; |
|||
that.djsday = djsday; |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
searchConfirm:function(e){ |
|||
var that = this; |
|||
var keyword = e.detail.value; |
|||
that.keyword = keyword; |
|||
that.getdata(); |
|||
}, |
|||
regetcaptcha:function(){ |
|||
this.randt = this.randt+'1'; |
|||
}, |
|||
setcaptcha:function(e){ |
|||
this.captcha = e.detail.value; |
|||
}, |
|||
setsmscode:function(e){ |
|||
this.smscode = e.detail.value; |
|||
}, |
|||
setsmstel:function(e){ |
|||
this.smstel = e.detail.value; |
|||
}, |
|||
sendsmscode: function () { |
|||
var that = this; |
|||
if (that.hqing == 1) return; |
|||
that.hqing = 1; |
|||
var smstel = that.smstel; |
|||
if (smstel == '') { |
|||
app.alert('请输入手机号码'); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
if (!/^1[3456789]\d{9}$/.test(smstel)) { |
|||
app.alert("手机号码有误,请重填"); |
|||
that.hqing = 0; |
|||
return false; |
|||
} |
|||
app.post("ApiIndex/sendsms", {tel: smstel}, function (data) { |
|||
if (data.status != 1) { |
|||
app.alert(data.msg);return; |
|||
} |
|||
}); |
|||
var time = 120; |
|||
var interval1 = setInterval(function () { |
|||
time--; |
|||
if (time < 0) { |
|||
that.smsdjs = '重新获取'; |
|||
that.hqing = 0; |
|||
clearInterval(interval1); |
|||
} else if (time >= 0) { |
|||
that.smsdjs = time + '秒'; |
|||
} |
|||
}, 1000); |
|||
}, |
|||
closeCaptcha:function(){ |
|||
this.$refs.dialogCaptcha.close(); |
|||
}, |
|||
closeSmscode:function(){ |
|||
this.$refs.dialogSmscode.close(); |
|||
}, |
|||
toupiao:function(e){ |
|||
var that = this; |
|||
var id = e.currentTarget.dataset.id; |
|||
var type = e.currentTarget.dataset.type; |
|||
if(type == 0 && that.info.help_check == 1){ |
|||
this.nowjoinid = id; |
|||
this.$refs.dialogCaptcha.open(); |
|||
return; |
|||
} |
|||
if(type == 0 && that.info.help_check == 2){ |
|||
this.nowjoinid = id; |
|||
this.$refs.dialogSmscode.open(); |
|||
return; |
|||
} |
|||
app.showLoading('投票中'); |
|||
app.post('ApiToupiao/toupiao',{id:id,captcha:that.captcha,smstel:that.smstel,smscode:that.smscode},function(res){ |
|||
app.showLoading(false); |
|||
if(res.status==1){ |
|||
app.success(res.msg); |
|||
var datalist = that.datalist; |
|||
for(var i in datalist){ |
|||
if(datalist[i].id == id){ |
|||
datalist[i].helpnum++;break; |
|||
} |
|||
} |
|||
that.datalist = datalist; |
|||
that.info.helpnum++ |
|||
if(type == 1 && that.info.help_check == 1){ |
|||
that.$refs.dialogCaptcha.close(); |
|||
} |
|||
if(type == 1 && that.info.help_check == 2){ |
|||
that.$refs.dialogSmscode.close(); |
|||
} |
|||
}else{ |
|||
app.alert(res.msg); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
|
|||
.banner{width:100%;} |
|||
.banner image{width:100%;height:auto} |
|||
|
|||
.box1{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:60rpx 10rpx;display:flex;align-items:center;position:relative;z-index:12;margin-top:-160rpx} |
|||
.box1 .item{flex:1;display:flex;flex-direction:column;align-items:center;} |
|||
.box1 .item .t1{font-size:48rpx;font-weight:bold} |
|||
.box1 .item .t2{font-size:24rpx;color:#778899;margin-top:10rpx} |
|||
.box2{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:20rpx 10rpx;display:flex;flex-direction:column;align-items:center;margin-top:20rpx} |
|||
.box2 .f1{display:flex;align-items:center;color:#222222} |
|||
.box2 .f2{display:flex;align-items:flex-end;color:#222222;margin-top:20rpx;font-size:24rpx} |
|||
.box2 .f2 .t1{font-size:48rpx;font-weight:bold;padding:0 12rpx} |
|||
.box2 .f2 .t2{color:#222222;height:48rpx;line-height:48rpx} |
|||
|
|||
.topsearch{width:94%;margin:40rpx 3% 10rpx 3%;} |
|||
.topsearch .topsearch-f1{height:80rpx;border-radius:10rpx;border:0;background-color:#f5f5f6;flex:1} |
|||
.topsearch .topsearch-f1 .img{width:24rpx;height:24rpx;margin-left:10px} |
|||
.topsearch .topsearch-f1 input{height:100%;flex:1;padding:0 20rpx;font-size:28rpx;color:#333;} |
|||
|
|||
.box3{width:96%;margin-left:2%;display:flex;flex-wrap:wrap;margin-top:20rpx;} |
|||
.box3 .item{width:48%;margin:8rpx 1%;background:#fff;border-radius:12rpx;overflow:hidden;position:relative;padding-bottom:24rpx} |
|||
.box3 .item .pic {width: 100%;height:0;overflow:hidden;background: #f7f7f8;padding-bottom: 100%;position: relative;margin-bottom:10rpx} |
|||
.box3 .item .pic .img{position:absolute;top:0;left:0;width: 100%;height:auto} |
|||
.box3 .item .name{padding:10rpx 10rpx;color:#222222;font-size:28rpx;font-weight:bold;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.box3 .item .no{color:#778899;font-size:24rpx;padding:4rpx 10rpx;} |
|||
.box3 .item .helpnum{color:#778899;font-size:24rpx;padding:4rpx 10rpx;} |
|||
.box3 .item .tou{position:absolute;bottom:30rpx;right:20rpx;border-radius:24rpx;font-size:22rpx;color:#fff;height:48rpx;line-height:48rpx;padding:0 20rpx} |
|||
|
|||
.box3 .itemlist{width:98%;margin:8rpx 1%;background:#fff;border-radius:12rpx;overflow:hidden;position:relative;padding:24rpx;display:flex} |
|||
.box3 .itemlist .pic {width:180rpx;height:180rpx;overflow:hidden;background: #f7f7f8;position: relative;} |
|||
.box3 .itemlist .pic .img{position:absolute;top:0;left:0;width: 100%;height:auto} |
|||
.box3 .itemlist .right{padding-left:20rpx;flex:1} |
|||
.box3 .itemlist .name{margin:10rpx 10rpx;color:#222222;font-size:28rpx;font-weight:bold;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.box3 .itemlist .no{color:#778899;font-size:24rpx;padding:4rpx 10rpx;} |
|||
.box3 .itemlist .helpnum{color:#778899;font-size:24rpx;padding:4rpx 10rpx;} |
|||
.box3 .itemlist .tou{position:absolute;bottom:30rpx;right:20rpx;border-radius:24rpx;font-size:22rpx;color:#fff;height:48rpx;line-height:48rpx;padding:0 20rpx} |
|||
|
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .hxqrbox1{display:flex;align-items:center} |
|||
.hxqrbox .hxqrbox1 input{width:270rpx;} |
|||
.hxqrbox .hxqrbox1 image{width:210rpx;height:70rpx} |
|||
.hxqrbox .tou2{border-radius:24rpx;font-size:32rpx;color:#fff;height:80rpx;line-height:80rpx;padding:0 20rpx;text-align:center;margin-top:60rpx} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
</style> |
|||
@ -0,0 +1,168 @@ |
|||
<template> |
|||
<view class="container" :style="{background:info.color1}"> |
|||
<block v-if="isload"> |
|||
<view class="banner"><image :src="info.banner" mode="widthFix"></image></view> |
|||
<view class="box1"> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.joinnum}}</view><view class="t2">参与人数</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.helpnum}}</view><view class="t2">累计投票</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.readcount}}</view><view class="t2">访问次数</view></view> |
|||
</view> |
|||
<view class="box2"> |
|||
<block v-for="(item,index) in datalist"> |
|||
<view class="item" @tap="goto" :data-url="'detail?id='+item.id"> |
|||
<view class="f1" :style="{color:info.color2}">{{index+1}}</view> |
|||
<view class="right"> |
|||
<view class="f2"> |
|||
<image :src="item.pic" class="img"/> |
|||
<view class="t1"> |
|||
<text class="x1">{{item.name}}</text> |
|||
<text class="x2">编号:{{item.number}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="f3" :style="{color:info.color2}">{{item.helpnum}}</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<view v-if="!nomore" style="width:100%;text-align:center;height:40rpx;line-height:40rpx;color:#778899;font-size:26rpx;margin-top:30rpx" @tap="getmore">- 查看更多 -</view> |
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata"></nodata> |
|||
</view> |
|||
<view style="width:100%;height:20rpx"></view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
|
|||
info: {}, |
|||
nowtime:0, |
|||
djsday: '00', |
|||
djshour: '00', |
|||
djsmin: '00', |
|||
djssec: '00', |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onUnload: function () { |
|||
clearInterval(interval); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiToupiao/phb', {id:that.opt.id,pagenum:pagenum}, function (res) { |
|||
that.loading = false; |
|||
if (pagenum == 1) { |
|||
that.datalist = res.datalist; |
|||
if ((that.datalist).length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
|
|||
that.info = res.info; |
|||
that.nowtime = res.nowtime; |
|||
//uni.setNavigationBarTitle({ |
|||
// title: that.info.name |
|||
//}); |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.pic; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
that.loaded({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
|
|||
clearInterval(interval); |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
}else{ |
|||
if ((res.datalist).length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(res.datalist); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
if (that.info.starttime * 1 > that.nowtime * 1) { |
|||
var totalsec = that.info.starttime * 1 - that.nowtime * 1; |
|||
} else { |
|||
var totalsec = that.info.endtime * 1 - that.nowtime * 1; |
|||
} |
|||
if (totalsec <= 0) { |
|||
that.djsday = '00'; |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djsday = (date < 10 ? '0' : '') + date; |
|||
var djshour = (houer < 10 ? '0' : '') + houer; |
|||
var djsmin = (min < 10 ? '0' : '') + min; |
|||
var djssec = (sec < 10 ? '0' : '') + sec; |
|||
that.djsday = djsday; |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
getmore:function(){ |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.container{min-height:100vh;display:flex;flex-direction:column;} |
|||
.banner{width:100%;} |
|||
.banner image{width:100%;height:auto} |
|||
|
|||
.box1{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:60rpx 10rpx;display:flex;align-items:center;position:relative;z-index:12;margin-top:-160rpx} |
|||
.box1 .item{flex:1;display:flex;flex-direction:column;align-items:center;} |
|||
.box1 .item .t1{font-size:48rpx;font-weight:bold} |
|||
.box1 .item .t2{font-size:24rpx;color:#778899;margin-top:10rpx} |
|||
|
|||
.box2{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:30rpx 10rpx;display:flex;flex-direction:column;align-items:center;position:relative;z-index:12;margin-top:20rpx} |
|||
.box2 .item{width:100%;display:flex;align-items:center;padding:0 40rpx 0 0;} |
|||
.box2 .item .f1{font-size:36rpx;font-weight:bold;width:100rpx;text-align:center} |
|||
.box2 .item .right{flex:1;border-bottom:1px solid #EEEEEE;display:flex;padding:20rpx 0;} |
|||
.box2 .item .f2{display:flex;align-items:center;} |
|||
.box2 .item .f2 .img{width:80rpx;height:80rpx;border-radius:50%;margin-right:20rpx;flex-shrink:0} |
|||
.box2 .item .f2 .t1{display:flex;flex-direction:column;} |
|||
.box2 .item .f2 .t1 .x1{color:#222222;font-size:28rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;} |
|||
.box2 .item .f2 .t1 .x2{color:#778899;font-size:24rpx} |
|||
.box2 .item .f3{flex:1;font-size:36rpx;font-weight:bold;display:flex;align-items:center;justify-content:flex-end;} |
|||
</style> |
|||
@ -0,0 +1,190 @@ |
|||
<template> |
|||
<view class="container" style="min-height:100vh" :style="{background:info.color1}"> |
|||
<block v-if="isload"> |
|||
<view class="banner"><image :src="info.banner" mode="widthFix"></image></view> |
|||
<view class="box1"> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.joinnum}}</view><view class="t2">参与人数</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.helpnum}}</view><view class="t2">累计投票</view></view> |
|||
<view class="item"><view class="t1" :style="{color:info.color2}">{{info.readcount}}</view><view class="t2">访问次数</view></view> |
|||
</view> |
|||
<view class="box2"> |
|||
<view class="title"><text style="color:#999;font-weight:normal;padding-right:20rpx"> —— </text> 活动规则 <text style="color:#999;font-weight:normal;padding-left:20rpx"> —— </text></view> |
|||
<parse :content="info.guize" /> |
|||
</view> |
|||
<view style="width:100%;height:60rpx"></view> |
|||
|
|||
|
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
var interval = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
aid:app.globalData.aid, |
|||
session_id:app.globalData.session_id, |
|||
captcha:'', |
|||
randt:'', |
|||
nowjoinid:0, |
|||
smscode:'', |
|||
smsdjs: '', |
|||
smstel:'', |
|||
hqing: 0, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
nodata: false, |
|||
|
|||
info: {}, |
|||
nowtime:0, |
|||
djsday: '00', |
|||
djshour: '00', |
|||
djsmin: '00', |
|||
djssec: '00', |
|||
keyword:'', |
|||
}; |
|||
}, |
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
return; |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
onUnload: function (loadmore) { |
|||
clearInterval(interval); |
|||
}, |
|||
onShareAppMessage: function () { |
|||
var that = this; |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
return this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
}, |
|||
onShareTimeline:function(){ |
|||
var that = this; |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
var sharewxdata = this._sharewx({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
var query = (sharewxdata.path).split('?')[1]; |
|||
return { |
|||
title: sharewxdata.title, |
|||
imageUrl: sharewxdata.imageUrl, |
|||
query: query |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiToupiao/index', {id:that.opt.id,pagenum:pagenum,keyword:that.keyword}, function (res) { |
|||
that.loading = false; |
|||
|
|||
if (pagenum == 1) { |
|||
that.datalist = res.datalist; |
|||
if ((that.datalist).length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.info = res.info; |
|||
that.nowtime = res.nowtime; |
|||
uni.setNavigationBarTitle({ |
|||
title: that.info.name |
|||
}); |
|||
var title = that.info.sharetitle ? that.info.sharetitle : that.info.name; |
|||
var sharepic = that.info.sharepic ? that.info.sharepic : that.info.banner; |
|||
var sharelink = that.info.sharelink ? that.info.sharelink : ''; |
|||
var sharedesc = that.info.sharedesc ? that.info.sharedesc : ''; |
|||
that.loaded({title:title,desc:sharedesc,link:sharelink,pic:sharepic}); |
|||
|
|||
clearInterval(interval); |
|||
interval = setInterval(function () { |
|||
that.nowtime = that.nowtime + 1; |
|||
that.getdjs(); |
|||
}, 1000); |
|||
|
|||
that.loaded(); |
|||
}else{ |
|||
if ((res.datalist).length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(res.datalist); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
getdjs: function () { |
|||
var that = this; |
|||
if (that.info.starttime * 1 > that.nowtime * 1) { |
|||
var totalsec = that.info.starttime * 1 - that.nowtime * 1; |
|||
} else { |
|||
var totalsec = that.info.endtime * 1 - that.nowtime * 1; |
|||
} |
|||
if (totalsec <= 0) { |
|||
that.djsday = '00'; |
|||
that.djshour = '00'; |
|||
that.djsmin = '00'; |
|||
that.djssec = '00'; |
|||
} else { |
|||
var date = Math.floor(totalsec / 86400); |
|||
var houer = Math.floor((totalsec - date * 86400) / 3600); |
|||
var min = Math.floor((totalsec - date * 86400 - houer * 3600) / 60); |
|||
var sec = totalsec - date * 86400 - houer * 3600 - min * 60; |
|||
var djsday = (date < 10 ? '0' : '') + date; |
|||
var djshour = (houer < 10 ? '0' : '') + houer; |
|||
var djsmin = (min < 10 ? '0' : '') + min; |
|||
var djssec = (sec < 10 ? '0' : '') + sec; |
|||
that.djsday = djsday; |
|||
that.djshour = djshour; |
|||
that.djsmin = djsmin; |
|||
that.djssec = djssec; |
|||
} |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
|
|||
.banner{width:100%;} |
|||
.banner image{width:100%;height:auto} |
|||
|
|||
.box1{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:60rpx 10rpx;display:flex;align-items:center;position:relative;z-index:12;margin-top:-160rpx} |
|||
.box1 .item{flex:1;display:flex;flex-direction:column;align-items:center;} |
|||
.box1 .item .t1{font-size:48rpx;font-weight:bold} |
|||
.box1 .item .t2{font-size:24rpx;color:#778899;margin-top:10rpx} |
|||
.box2{width:94%;margin-left:3%;border-radius:12rpx;background:#fff;padding:20rpx 20rpx;display:flex;flex-direction:column;align-items:center;margin-top:20rpx} |
|||
.box2 .title{width:100%;text-align:center;font-size:32rpx;color:#222222;font-weight:bold;height:100rpx;line-height:100rpx;margin-bottom:20rpx} |
|||
|
|||
|
|||
</style> |
|||
@ -0,0 +1,736 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="topay"> |
|||
<view v-if="needaddress==0" class="address-add"> |
|||
<view class="linkitem"> |
|||
<text class="f1">联 系 人:</text> |
|||
<input type="text" class="input" :value="linkman" placeholder="请输入您的姓名" @input="inputLinkman" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
<view class="linkitem"> |
|||
<text class="f1">联系电话:</text> |
|||
<input type="text" class="input" :value="tel" placeholder="请输入您的手机号" @input="inputTel" placeholder-style="color:#626262;font-size:28rpx;"/> |
|||
</view> |
|||
</view> |
|||
<view v-else class="address-add flex-y-center" @tap="goto" :data-url="'/pages/address/address?fromPage=buy&type=' + (havetongcheng==1?'1':'0')"> |
|||
<view class="f1"><image class="img" :src="event_rul +'/static/img/static/img/address.png'"/></view> |
|||
<view class="f2 flex1" v-if="address.name"> |
|||
<view style="font-weight:bold;color:#111111;font-size:30rpx">{{address.name}} {{address.tel}}</view> |
|||
<view style="font-size:24rpx">{{address.area}} {{address.address}}</view> |
|||
</view> |
|||
<view v-else class="f2 flex1">请选择收货地址</view> |
|||
<image :src="event_rul +'/static/img/static/img/arrowright.png'" class="f3"/> |
|||
</view> |
|||
<view class="buydata"> |
|||
<view class="btitle"><image class="img" :src="event_rul +'/static/img/static/img/ico-shop.png'"/>{{business.name}}</view> |
|||
<view class="bcontent"> |
|||
<view class="product"> |
|||
<view class="item flex"> |
|||
<view class="img" @tap="goto" :data-url="'product?id='+product.id"><image class="img" :src="product.pic"/></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{product.name}}</view> |
|||
<view class="f3">¥{{product.sell_price}}<text v-if="buytype!=1" class="collage_icon">团购</text> × {{num}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="freight"> |
|||
<view class="f1">配送方式</view> |
|||
<view class="freight-ul"> |
|||
<view class="flex" style="width:100%;overflow-y:hidden;overflow-x:scroll;"> |
|||
<block v-for="(item, idx2) in freightList" :key="idx2"> |
|||
<view class="freight-li" :style="freightkey==idx2?'color:'+t('color1')+';background:rgba('+t('color1rgb')+',0.2)':''" @tap="changeFreight" :data-index="idx2">{{item.name}}</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].minpriceset==1 && freightList[freightkey].minprice > 0 && freightList[freightkey].minprice*1 > product_price*1">满{{freightList[freightkey].minprice}}元起送,还差{{freightList[freightkey].minprice - product_price}}元</view> |
|||
<view class="freighttips" v-if="freightList[freightkey].isoutjuli==1">超出配送范围</view> |
|||
</view> |
|||
<view class="price" v-if="freightList[freightkey].pstimeset==1"> |
|||
<view class="f1">{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</view> |
|||
<view class="f2" @tap="choosePstime">{{pstimetext==''?'请选择时间':pstimetext}}<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
</view> |
|||
<view class="storeitem" v-if="freightList[freightkey].pstype==1"> |
|||
<view class="panel"> |
|||
<view class="f1">取货地点</view> |
|||
<view class="f2" @tap="openMendian" :data-freightkey="freightkey" :data-storekey="freightList[freightkey].storekey"><text class="iconfont icondingwei"></text>{{freightList[freightkey].storedata[freightList[freightkey].storekey].name}}</view> |
|||
</view> |
|||
<block v-for="(item, idx) in freightList[freightkey].storedata" :key="idx"> |
|||
<view class="radio-item" @tap.stop="choosestore" :data-index="idx" v-if="idx<5 || storeshowall==true"> |
|||
<view class="f1">{{item.name}} </view> |
|||
<text style="color:#f50;">{{item.juli}}</text> |
|||
<view class="radio" :style="freightList[freightkey].storekey==idx ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</block> |
|||
<view v-if="storeshowall==false && (freightList[freightkey].storedata).length > 5" class="storeviewmore" @tap="doStoreShowAll">- 查看更多 - </view> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">商品金额</text> |
|||
<text class="f2">¥{{product_price}}</text> |
|||
</view> |
|||
<view class="price" v-if="leveldk_money*1>0"> |
|||
<text class="f1">{{t('会员')}}折扣({{userinfo.discount}}折)</text> |
|||
<text class="f2">-¥{{leveldk_money}}</text> |
|||
</view> |
|||
<view class="price"> |
|||
<text class="f1">运费</text> |
|||
<text class="f2">+¥{{freight_price}}</text> |
|||
</view> |
|||
|
|||
<view class="price"> |
|||
<view class="f1">{{t('优惠券')}}</view> |
|||
<view v-if="couponList.length>0" class="f2" @tap="showCouponList"><text style="color:#fff;padding:4rpx 16rpx;font-weight:normal;border-radius:8rpx;font-size:24rpx" :style="{background:t('color1')}">{{couponrid!=0?couponList[couponkey].couponname:couponList.length+'张可用'}}</text><text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text></view> |
|||
<text class="f2" v-else style="color:#999">无可用{{t('优惠券')}}</text> |
|||
</view> |
|||
|
|||
<view style="display:none">{{test}}</view> |
|||
<view class="form-item" v-for="(item,idx) in freightList[freightkey].formdata" :key="item.id"> |
|||
<view class="label">{{item.val1}}<text v-if="item.val3==1" style="color:red"> *</text></view> |
|||
<block v-if="item.key=='input'"> |
|||
<input type="text" :name="'form'+idx" class="input" :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='textarea'"> |
|||
<textarea :name="'form'+idx" class='textarea' :placeholder="item.val2" placeholder-style="font-size:28rpx"/> |
|||
</block> |
|||
<block v-if="item.key=='radio'"> |
|||
<radio-group class="radio-group" :name="'form'+idx"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<radio class="radio" :value="item1"/>{{item1}} |
|||
</label> |
|||
</radio-group> |
|||
</block> |
|||
<block v-if="item.key=='checkbox'"> |
|||
<checkbox-group :name="'form'+idx" class="checkbox-group"> |
|||
<label v-for="(item1,idx1) in item.val2" :key="item1.id" class="flex-y-center"> |
|||
<checkbox class="checkbox" :value="item1"/>{{item1}} |
|||
</label> |
|||
</checkbox-group> |
|||
</block> |
|||
<block v-if="item.key=='selector'"> |
|||
<picker class="picker" mode="selector" :name="'form'+idx" value="" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx] || editorFormdata[idx]===0"> {{item.val2[editorFormdata[idx]]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='time'"> |
|||
<picker class="picker" mode="time" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='date'"> |
|||
<picker class="picker" mode="date" :name="'form'+idx" value="" :start="item.val2[0]" :end="item.val2[1]" :range="item.val2" @change="editorBindPickerChange" :data-idx="idx"> |
|||
<view v-if="editorFormdata[idx]">{{editorFormdata[idx]}}</view> |
|||
<view v-else>请选择</view> |
|||
</picker> |
|||
<text class="iconfont iconjiantou" style="color:#999;font-weight:normal"></text> |
|||
</block> |
|||
<block v-if="item.key=='upload'"> |
|||
<input type="text" style="display:none" :name="'form'+idx" :value="editorFormdata[idx]"/> |
|||
<view class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view class="form-imgbox" v-if="editorFormdata[idx]"> |
|||
<view class="form-imgbox-img"><image class="image" :src="editorFormdata[idx]" @click="previewImage" :data-url="editorFormdata[idx]" mode="widthFix"/></view> |
|||
</view> |
|||
<view class="form-uploadbtn" :style="{background:'url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 50rpx',backgroundSize:'80rpx 80rpx',backgroundColor:'#F3F3F3'}" @click="editorChooseImage" :data-idx="idx"></view> |
|||
</view> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="scoredk" |
|||
v-if="userinfo.score2money>0 && (userinfo.scoremaxtype==0 || (userinfo.scoremaxtype==1 && userinfo.scoredkmaxmoney>0))"> |
|||
<checkbox-group @change="scoredk" class="flex" style="width:100%"> |
|||
<view class="f1"> |
|||
<view>{{userinfo.score*1}} {{t('积分')}}可抵扣 <text |
|||
style="color:#e94745">{{userinfo.scoredk_money*1}}</text> 元</view> |
|||
<view style="font-size:22rpx;color:#999" |
|||
v-if="userinfo.scoremaxtype==0 && userinfo.scoredkmaxpercent > 0 && userinfo.scoredkmaxpercent<100"> |
|||
最多可抵扣订单金额的{{userinfo.scoredkmaxpercent}}%</view> |
|||
<view style="font-size:22rpx;color:#999" v-else-if="userinfo.scoremaxtype==1"> |
|||
最多可抵扣{{userinfo.scoredkmaxmoney}}元</view> |
|||
</view> |
|||
<view class="f2">使用{{t('积分')}}抵扣 |
|||
<checkbox value="1" style="margin-left:6px;transform:scale(.8)"></checkbox> |
|||
</view> |
|||
</checkbox-group> |
|||
</view> |
|||
<view style="padding:5px 3%;font-size:22rpx;color:red">注:商品金额并非实际成交的商品金额,活动结束后所有参与人均按照已达成的最低团购价格计算,多付的金额将全部退还</view> |
|||
<view style="width: 100%;height:110rpx"></view> |
|||
<view class="footer flex notabbarbot"> |
|||
<view class="text1 flex1">总计: |
|||
<text style="font-weight:bold;font-size:36rpx">¥{{totalprice}}</text> |
|||
</view> |
|||
<button class="op" form-type="submit" :style="{background:'linear-gradient(-90deg,'+t('color1')+' 0%,rgba('+t('color1rgb')+',0.8) 100%)'}">提交订单</button> |
|||
</view> |
|||
</form> |
|||
|
|||
<view v-if="couponvisible" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="handleClickMask"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{t('优惠券')}}</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="handleClickMask"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<couponlist :couponlist="couponList" :choosecoupon="true" :selectedrid="couponrid" :bid="product.bid" @chooseCoupon="chooseCoupon"></couponlist> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="pstimeDialogShow" class="popup__container"> |
|||
<view class="popup__overlay" @tap.stop="hidePstimeDialog"></view> |
|||
<view class="popup__modal"> |
|||
<view class="popup__title"> |
|||
<text class="popup__title-text">请选择{{freightList[freightkey].pstype==1?'取货':'配送'}}时间</text> |
|||
<image :src="event_rul +'/static/img/static/img/close.png'" class="popup__close" style="width:36rpx;height:36rpx" @tap.stop="hidePstimeDialog"/> |
|||
</view> |
|||
<view class="popup__content"> |
|||
<view class="pstime-item" v-for="(item, index) in freightList[freightkey].pstimeArr" :key="index" @tap="pstimeRadioChange" :data-index="index"> |
|||
<view class="flex1">{{item.title}}</view> |
|||
<view class="radio" :style="freight_time==item.value ? 'background:'+t('color1')+';border:0' : ''"><image class="radio-img" :src="event_rul +'/static/img/static/img/checkd.png'"/></view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
editorFormdata:[], |
|||
test:'test', |
|||
|
|||
business:{}, |
|||
productList: [], |
|||
freightList: [], |
|||
couponList: [], |
|||
couponrid: 0, |
|||
coupontype: 1, |
|||
address: [], |
|||
needaddress: 1, |
|||
linkman: '', |
|||
tel: '', |
|||
freightkey: 0, |
|||
freight_price: 0, |
|||
pstimetext: '', |
|||
freight_time: '', |
|||
usescore: 0, |
|||
totalprice: '0.00', |
|||
product_price: 0, |
|||
leveldk_money: 0, |
|||
scoredk_money: 0, |
|||
coupon_money: 0, |
|||
storedata: [], |
|||
storeid: '', |
|||
storename: '', |
|||
latitude: '', |
|||
longitude: '', |
|||
isload: 0, |
|||
leadermoney: 0, |
|||
couponvisible: false, |
|||
pstimeDialogShow: false, |
|||
pstimeIndex: -1, |
|||
product: "", |
|||
guige: "", |
|||
userinfo: "", |
|||
buytype: "", |
|||
scorebdkyf: "", |
|||
num: "", |
|||
havetongcheng: "", |
|||
weight: "", |
|||
goodsnum: "", |
|||
beizhu: "", |
|||
couponkey: 0, |
|||
storeshowall:false, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; //获取产品信息 |
|||
that.loading = true; |
|||
app.get('ApiTuangou/buy', {prodata:that.opt.prodata}, function (res) { |
|||
that.loading = false; |
|||
if (res.status == 0) { |
|||
app.alert(res.msg,function(){ |
|||
app.goback(); |
|||
});return; |
|||
} |
|||
var product = res.product; |
|||
var freightList = res.freightList; |
|||
var userinfo = res.userinfo; |
|||
var couponList = res.couponList; |
|||
that.business = res.business; |
|||
that.product = product; |
|||
that.freightList = freightList; |
|||
that.userinfo = userinfo; |
|||
that.couponList = couponList; |
|||
that.buytype = res.buytype; |
|||
that.address = res.address; |
|||
that.scorebdkyf = res.scorebdkyf; |
|||
that.num = res.num; |
|||
that.havetongcheng = res.havetongcheng; |
|||
that.linkman = res.linkman; |
|||
that.tel = res.tel; |
|||
|
|||
var product_price = product.sell_price * res.num; |
|||
var weight = product.weight; |
|||
var goodsnum = 0; |
|||
|
|||
var leveldk_money = 0; |
|||
if (userinfo.discount > 0 && userinfo.discount < 10) { |
|||
leveldk_money = product_price * (1 - userinfo.discount * 0.1); |
|||
leveldk_money = leveldk_money.toFixed(2); |
|||
} |
|||
product_price = product_price.toFixed(2); |
|||
that.product_price = product_price; |
|||
that.leveldk_money = leveldk_money; |
|||
that.weight = weight; |
|||
that.scoredk_money = userinfo.scoredk_money; |
|||
that.goodsnum = goodsnum; |
|||
that.isload = 1; |
|||
that.calculatePrice(); |
|||
that.loaded(); |
|||
|
|||
if (res.needLocation == 1) { |
|||
app.getLocation(function (res) { |
|||
var latitude = res.latitude; |
|||
var longitude = res.longitude; |
|||
|
|||
for (var j in freightList) { |
|||
if (freightList[j].pstype == 1) { |
|||
var storedata = freightList[j].storedata; |
|||
|
|||
if (storedata) { |
|||
for (var x in storedata) { |
|||
if (latitude && longitude && storedata[x].latitude && storedata[x].longitude){ |
|||
var juli = that.getDistance(latitude, longitude, storedata[x].latitude, storedata[x].longitude); |
|||
storedata[x].juli = juli; |
|||
} |
|||
} |
|||
storedata.sort(function (a, b) { |
|||
return a["juli"] - b["juli"]; |
|||
}); |
|||
for (var x in storedata) { |
|||
if (storedata[x].juli) { |
|||
storedata[x].juli = storedata[x].juli + '千米'; |
|||
} |
|||
} |
|||
freightList[j].storedata = storedata; |
|||
} |
|||
} |
|||
} |
|||
that.freightList = freightList; |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
//积分抵扣 |
|||
scoredk: function (e) { |
|||
var usescore = e.detail.value[0]; |
|||
if (!usescore) usescore = 0; |
|||
this.usescore = usescore; |
|||
this.calculatePrice(); |
|||
}, |
|||
inputLinkman: function (e) { |
|||
this.linkman = e.detail.value |
|||
}, |
|||
inputTel: function (e) { |
|||
this.tel = e.detail.value |
|||
}, |
|||
//选择收货地址 |
|||
chooseAddress: function () { |
|||
app.goto('/pages/address/address?fromPage=buy&type=' + (this.havetongcheng == 1 ? '1' : '0')); |
|||
}, |
|||
//计算价格 |
|||
calculatePrice: function () { |
|||
var that = this; |
|||
var product_price = parseFloat(that.product_price); //+商品总价 |
|||
var leadermoney = parseFloat(that.leadermoney); //-团长优惠 |
|||
var leveldk_money = parseFloat(that.leveldk_money); //-会员折扣 |
|||
var coupon_money = parseFloat(that.coupon_money); //-优惠券抵扣 |
|||
var address = that.address; //算运费 |
|||
var freightdata = that.freightList[that.freightkey]; |
|||
if (freightdata.pstype != 1 && freightdata.pstype != 3 && freightdata.pstype != 4) { |
|||
var needaddress = 1; |
|||
} else { |
|||
var needaddress = 0; |
|||
} |
|||
that.needaddress = needaddress; |
|||
var freight_price = freightdata.freight_price; |
|||
|
|||
if (that.coupontype == 4) { |
|||
freight_price = 0; |
|||
coupon_money = 0; |
|||
} |
|||
var totalprice = product_price - leadermoney - leveldk_money - coupon_money; |
|||
if (totalprice < 0) totalprice = 0; //优惠券不抵扣运费 |
|||
|
|||
var oldtotalprice = totalprice; |
|||
if (that.usescore) { |
|||
var scoredk_money = parseFloat(that.scoredk_money); //-积分抵扣 |
|||
} else { |
|||
var scoredk_money = 0; |
|||
} |
|||
totalprice = totalprice + freight_price - scoredk_money; |
|||
if (that.scorebdkyf == '1' && scoredk_money > 0 && totalprice < freight_price) { |
|||
//积分不抵扣运费 |
|||
totalprice = freight_price; |
|||
scoredk_money = oldtotalprice - freight_price; |
|||
} |
|||
var scoredkmaxpercent = parseFloat(that.userinfo.scoredkmaxpercent); //最大抵扣比例 |
|||
var scoremaxtype = parseInt(that.userinfo.scoremaxtype); |
|||
var scoredkmaxmoney = parseFloat(that.userinfo.scoredkmaxmoney); |
|||
|
|||
if (scoremaxtype == 0 && scoredk_money > 0 && scoredkmaxpercent > 0 && scoredkmaxpercent < 100 && |
|||
scoredk_money > oldtotalprice * scoredkmaxpercent * 0.01) { |
|||
scoredk_money = oldtotalprice * scoredkmaxpercent * 0.01; |
|||
totalprice = oldtotalprice - scoredk_money; |
|||
} else if (scoremaxtype == 1 && scoredk_money > scoredkmaxmoney) { |
|||
scoredk_money = scoredkmaxmoney; |
|||
totalprice = oldtotalprice - scoredk_money; |
|||
} |
|||
|
|||
if (totalprice < 0) totalprice = 0; |
|||
freight_price = freight_price.toFixed(2); |
|||
totalprice = totalprice.toFixed(2); |
|||
that.totalprice = totalprice |
|||
that.freight_price = freight_price; |
|||
}, |
|||
changeFreight: function (e) { |
|||
var that = this; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.freightkey = index; |
|||
that.calculatePrice(); |
|||
}, |
|||
chooseCoupon: function (e) { |
|||
var couponrid = e.rid; |
|||
var couponkey = e.key; |
|||
|
|||
if (couponrid == this.couponrid) { |
|||
this.couponkey = 0; |
|||
this.couponrid = 0; |
|||
this.coupontype = 1; |
|||
this.coupon_money = 0; |
|||
this.couponvisible = false; |
|||
} else { |
|||
var couponList = this.couponList; |
|||
var coupon_money = couponList[couponkey]['money']; |
|||
var coupontype = couponList[couponkey]['type']; |
|||
if (coupontype == 4) { |
|||
coupon_money = this.freightprice; |
|||
} |
|||
this.couponkey = couponkey; |
|||
this.couponrid = couponrid; |
|||
this.coupontype = coupontype; |
|||
this.coupon_money = coupon_money; |
|||
this.couponvisible = false; |
|||
} |
|||
this.calculatePrice(); |
|||
}, |
|||
choosePstime: function () { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var itemlist = []; |
|||
|
|||
for (var i = 0; i < pstimeArr.length; i++) { |
|||
itemlist.push(pstimeArr[i].title); |
|||
} |
|||
if (itemlist.length == 0) { |
|||
app.alert('当前没有可选' + (freightList[freightkey].pstype == 1 ? '取货' : '配送') + '时间段'); |
|||
return; |
|||
} |
|||
if (itemlist.length > 6) { |
|||
that.pstimeDialogShow = true; |
|||
that.pstimeIndex = -1; |
|||
} else { |
|||
uni.showActionSheet({ |
|||
itemList: itemlist, |
|||
success: function (res) { |
|||
if(res.tapIndex >= 0){ |
|||
var choosepstime = pstimeArr[res.tapIndex]; |
|||
that.pstimetext = choosepstime.title; |
|||
that.freight_time = choosepstime.value; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
pstimeRadioChange: function (e) { |
|||
var pstimeIndex = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey; |
|||
var freightList = this.freightList; |
|||
var freight = freightList[freightkey]; |
|||
var pstimeArr = freightList[freightkey].pstimeArr; |
|||
var choosepstime = pstimeArr[pstimeIndex]; |
|||
this.pstimetext = choosepstime.title; |
|||
this.freight_time = choosepstime.value; |
|||
this.pstimeDialogShow = false; |
|||
}, |
|||
hidePstimeDialog: function () { |
|||
this.pstimeDialogShow = false |
|||
}, |
|||
choosestore: function (e) { |
|||
var storekey = e.currentTarget.dataset.index; |
|||
var freightkey = this.freightkey |
|||
var freightList = this.freightList |
|||
freightList[freightkey].storekey = storekey |
|||
this.freightList = freightList; |
|||
}, |
|||
//提交并支付 |
|||
topay: function (e) { |
|||
var that = this; |
|||
var freightkey = this.freightkey; |
|||
var freightid = this.freightList[freightkey].id; |
|||
var prodata = this.opt.prodata; |
|||
var addressid = this.address.id; |
|||
var linkman = this.linkman; |
|||
var tel = this.tel; |
|||
var usescore = this.usescore; |
|||
var couponkey = this.couponkey; |
|||
var couponrid = this.couponrid; |
|||
var freight_time = that.freight_time; //console.log(yhqrecoid); return; |
|||
|
|||
if(this.freightList[freightkey].pstype==1){ |
|||
var storekey = this.freightList[freightkey].storekey |
|||
var storeid = this.freightList[freightkey].storedata[storekey].id; |
|||
}else{ |
|||
var storeid = 0; |
|||
} |
|||
var needaddress = that.needaddress; |
|||
if (needaddress == 0) addressid = 0; |
|||
|
|||
if (needaddress == 1 && addressid == undefined) { |
|||
app.error('请选择收货地址'); |
|||
return; |
|||
} |
|||
|
|||
if (this.freightList[freightkey].pstimeset == 1 && freight_time == '') { |
|||
app.error('请选择' + (this.freightList[freightkey].pstype == 0 ? '配送' : '提货') + '时间'); |
|||
return; |
|||
} |
|||
|
|||
var formdataSet = this.freightList[freightkey].formdata; |
|||
var formdata = e.detail.value; |
|||
var newformdata = {}; |
|||
for (var i = 0; i < formdataSet.length;i++){ |
|||
if (formdataSet[i].val3 == 1 && (formdata['form' + i] === '' || formdata['form' + i] === undefined || formdata['form' + i].length==0)){ |
|||
app.alert(formdataSet[i].val1+' 必填');return; |
|||
} |
|||
if (formdataSet[i].key == 'selector') { |
|||
formdata['form' + i] = formdataSet[i].val2[formdata['form' + i]] |
|||
} |
|||
newformdata['form'+i] = formdata['form' + i]; |
|||
} |
|||
|
|||
app.showLoading('提交中'); |
|||
app.post('ApiTuangou/createOrder', { |
|||
proid: that.product.id, |
|||
ggid: that.guige.id, |
|||
num: that.num, |
|||
storeid: storeid, |
|||
couponrid: couponrid, |
|||
freightid: freightid, |
|||
freight_time: freight_time, |
|||
addressid: addressid, |
|||
usescore: usescore, |
|||
linkman: linkman, |
|||
tel: tel, |
|||
formdata: newformdata |
|||
}, function (data) { |
|||
app.showLoading(false); |
|||
if (data.status == 0) { |
|||
app.error(data.msg); |
|||
return; |
|||
} |
|||
app.goto('/pages/pay/pay?id=' + data.payorderid); |
|||
}); |
|||
}, |
|||
showCouponList: function () { |
|||
this.couponvisible = true; |
|||
}, |
|||
handleClickMask: function () { |
|||
this.couponvisible = false; |
|||
}, |
|||
openLocation:function(e){ |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
var latitude = parseFloat(storeinfo.latitude); |
|||
var longitude = parseFloat(storeinfo.longitude); |
|||
var address = storeinfo.name; |
|||
uni.openLocation({ |
|||
latitude:latitude, |
|||
longitude:longitude, |
|||
name:address, |
|||
scale: 13 |
|||
}) |
|||
}, |
|||
openMendian: function(e) { |
|||
var freightkey = e.currentTarget.dataset.freightkey; |
|||
var storekey = e.currentTarget.dataset.storekey; |
|||
var frightinfo = this.freightList[freightkey] |
|||
var storeinfo = frightinfo.storedata[storekey]; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
}, |
|||
editorChooseImage: function (e) { |
|||
var that = this; |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
app.chooseImage(function(data){ |
|||
editorFormdata[idx] = data[0]; |
|||
console.log(editorFormdata) |
|||
that.editorFormdata = editorFormdata |
|||
that.test = Math.random(); |
|||
}) |
|||
}, |
|||
editorBindPickerChange:function(e){ |
|||
var idx = e.currentTarget.dataset.idx; |
|||
var tplindex = e.currentTarget.dataset.tplindex; |
|||
var val = e.detail.value; |
|||
var editorFormdata = this.editorFormdata; |
|||
if(!editorFormdata) editorFormdata = []; |
|||
editorFormdata[idx] = val; |
|||
console.log(editorFormdata) |
|||
this.editorFormdata = editorFormdata |
|||
this.test = Math.random(); |
|||
}, |
|||
doStoreShowAll:function(){ |
|||
this.storeshowall = true; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style> |
|||
.address-add{ width:94%;margin:20rpx 3%;background:#fff;border-radius:20rpx;padding: 20rpx 3%;min-height:140rpx;} |
|||
.address-add .f1{margin-right:20rpx} |
|||
.address-add .f1 .img{ width: 66rpx; height: 66rpx; } |
|||
.address-add .f2{ color: #666; } |
|||
.address-add .f3{ width: 26rpx; height: 26rpx;} |
|||
|
|||
.linkitem{width: 100%;padding:1px 0;background: #fff;display:flex;align-items:center} |
|||
.linkitem .f1{width:160rpx;color:#111111} |
|||
.linkitem .input{height:50rpx;padding-left:10rpx;color:#222222;font-weight:bold;font-size:28rpx;flex:1} |
|||
|
|||
.buydata{width:94%;margin:0 3%;background:#fff;margin-bottom:20rpx;border-radius:20rpx;} |
|||
|
|||
.btitle{width:100%;padding:20rpx 20rpx;display:flex;align-items:center;color:#111111;font-weight:bold;font-size:30rpx} |
|||
.btitle .img{width:34rpx;height:34rpx;margin-right:10rpx} |
|||
|
|||
.bcontent{width:100%;padding:0 20rpx} |
|||
|
|||
.product{width:100%;border-bottom:1px solid #f4f4f4} |
|||
.product .item{width:100%; padding:20rpx 0;background:#fff;border-bottom:1px #ededed dashed;} |
|||
.product .item:last-child{border:none} |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f1{color: #222222;font-weight:bold;font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .info .f2{color: #999999; font-size:24rpx} |
|||
.product .info .f3{color: #FF4C4C; font-size:28rpx;display:flex;align-items:center;margin-top:30rpx} |
|||
.product .img{ width:140rpx;height:140rpx} |
|||
.collage_icon{ color:#fe7203;border:1px solid #feccaa;display:flex;align-items:center;font-size:20rpx;padding:0 6rpx;margin-left:6rpx} |
|||
|
|||
.freight{width:100%;padding:20rpx 0;background:#fff;display:flex;flex-direction:column;} |
|||
.freight .f1{color:#333;margin-bottom:10rpx} |
|||
.freight .f2{color: #111111;text-align:right;flex:1} |
|||
.freight .f3{width: 24rpx;height:28rpx;} |
|||
.freighttips{color:red;font-size:24rpx;} |
|||
|
|||
.freight-ul{width:100%;display:flex;} |
|||
.freight-li{flex-shrink:0;display:flex;background:#F5F6F8;border-radius:24rpx;color:#6C737F;font-size:24rpx;text-align: center;height:48rpx; line-height:48rpx;padding:0 28rpx;margin:12rpx 10rpx 12rpx 0} |
|||
|
|||
|
|||
.price{width:100%;padding:20rpx 0;background:#fff;display:flex;align-items:center} |
|||
.price .f1{color:#333} |
|||
.price .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.price .f3{width: 24rpx;height:24rpx;} |
|||
|
|||
.scoredk{width:94%;margin:0 3%;margin-bottom:20rpx;border-radius:20rpx;padding:24rpx 20rpx; background: #fff;display:flex;align-items:center} |
|||
.scoredk .f1{color:#333333} |
|||
.scoredk .f2{ color: #999999;text-align:right;flex:1} |
|||
|
|||
.remark{width: 100%;padding:16rpx 0;background: #fff;display:flex;align-items:center} |
|||
.remark .f1{color:#333;width:200rpx} |
|||
.remark input{ border:0px solid #eee;height:70rpx;padding-left:10rpx;text-align:right} |
|||
|
|||
.footer {width: 96%;background: #fff;margin-top: 5px;position: fixed;left: 0px;bottom: 0px;padding: 0 2%;display: flex;align-items: center;z-index: 8;box-sizing:content-box} |
|||
.footer .text1 {height:110rpx;line-height:110rpx;color: #2a2a2a;font-size: 30rpx;} |
|||
.footer .text1 text{color: #e94745;font-size: 32rpx;} |
|||
.footer .op{width: 200rpx;height:80rpx;line-height:80rpx;color: #fff;text-align: center;font-size: 30rpx;border-radius:44rpx} |
|||
|
|||
.storeitem{width: 100%;padding:20rpx 0;display:flex;flex-direction:column;color:#333} |
|||
.storeitem .panel{width: 100%;height:60rpx;line-height:60rpx;font-size:28rpx;color:#333;margin-bottom:10rpx;display:flex} |
|||
.storeitem .panel .f1{color:#333} |
|||
.storeitem .panel .f2{ color:#111;font-weight:bold;text-align:right;flex:1} |
|||
.storeitem .radio-item{display:flex;width:100%;color:#000;align-items: center;background:#fff;border-bottom:0 solid #eee;padding:8rpx 20rpx;} |
|||
.storeitem .radio-item:last-child{border:0} |
|||
.storeitem .radio-item .f1{color:#666;flex:1} |
|||
.storeitem .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-left:30rpx} |
|||
.storeitem .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.pstime-item{display:flex;border-bottom: 1px solid #f5f5f5;padding:20rpx 30rpx;} |
|||
.pstime-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.pstime-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
.cuxiao-desc{width:100%} |
|||
.cuxiao-item{display: flex;padding:0 40rpx 20rpx 40rpx;} |
|||
.cuxiao-item .type-name{font-size:28rpx; color: #49aa34;margin-bottom: 10rpx;flex:1} |
|||
.cuxiao-item .radio{flex-shrink:0;width: 32rpx;height: 32rpx;background: #FFFFFF;border: 2rpx solid #BFBFBF;border-radius: 50%;margin-right:30rpx} |
|||
.cuxiao-item .radio .radio-img{width:100%;height:100%} |
|||
|
|||
|
|||
.form-item {width: 100%;padding: 16rpx 0;background: #fff;display: flex;align-items: center;justify-content:space-between} |
|||
.form-item .label {color: #333;width: 200rpx;flex-shrink:0} |
|||
.form-item .radio{transform:scale(.7);} |
|||
.form-item .checkbox{transform:scale(.7);} |
|||
.form-item .input {border:0px solid #eee;height: 70rpx;padding-left: 10rpx;text-align: right;flex:1} |
|||
.form-item .textarea{height:140rpx;line-height:40rpx;overflow: hidden;flex:1;border:1px solid #eee;border-radius:2px;padding:8rpx} |
|||
.form-item .radio-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .radio{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .radio2{display:flex;align-items:center;} |
|||
.form-item .radio .myradio{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:50%} |
|||
.form-item .checkbox-group{display:flex;flex-wrap:wrap;justify-content:flex-end} |
|||
.form-item .checkbox{height: 70rpx;line-height: 70rpx;display:flex;align-items:center} |
|||
.form-item .checkbox2{display:flex;align-items:center;height: 40rpx;line-height: 40rpx;} |
|||
.form-item .checkbox .mycheckbox{margin-right:10rpx;display:inline-block;border:1px solid #aaa;background:#fff;height:32rpx;width:32rpx;border-radius:2px} |
|||
.form-item .picker{height: 70rpx;line-height:70rpx;flex:1;text-align:right} |
|||
|
|||
.form-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.form-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.form-imgbox-close .image{width:100%;height:100%} |
|||
.form-imgbox-img{display: block;width:180rpx;height:180rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.form-imgbox-img>.image{max-width:100%;} |
|||
.form-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.form-uploadbtn{position:relative;height:180rpx;width:180rpx} |
|||
|
|||
.storeviewmore{width:100%;text-align:center;color:#889;height:40rpx;line-height:40rpx;margin-top:10rpx} |
|||
</style> |
|||
@ -0,0 +1,193 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<form @submit="formSubmit"> |
|||
<view class="form-item1"> |
|||
<view class="label">商品信息</view> |
|||
<view class="product flex"> |
|||
<view class="img"><image :src="og.propic"></image></view> |
|||
<view class="info flex1"> |
|||
<view class="f1">{{og.proname}}</view> |
|||
<view class="f2">{{og.ggname}}</view> |
|||
<view class="f3">¥{{og.sell_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item2 flex flex-y-center"> |
|||
<view class="label">您的打分</view> |
|||
<view class="i-rate" @touchmove="handleTouchMove"> |
|||
<input type="text" name="score" :value="score" class="i-rate-hide-input"></input> |
|||
<view v-for="(item, index) in 5" :key="index" class="i-rate-star" :class="( index < score ? 'i-rate-current':'' )" :data-index="index" @tap="handleClick"> |
|||
<image v-if="index < score" :src="event_rul +'/static/img/static/img/star2.png'"></image> |
|||
<image v-else :src="event_rul +'/static/img/static/img/star.png'"></image> |
|||
</view> |
|||
<view class="i-rate-text"></view> |
|||
</view> |
|||
</view> |
|||
<view class="form-item3 flex-col"> |
|||
<view class="label">您的评价</view> |
|||
<textarea placeholder="输入您的评价内容" placeholder-style="color:#ccc;" name="content" :value="comment.content" style="height:200rpx" :disabled="comment.id?true:false"></textarea> |
|||
</view> |
|||
|
|||
<view class="form-item4 flex-col"> |
|||
<view class="label">上传图片</view> |
|||
<view id="content_picpreview" class="flex" style="flex-wrap:wrap;padding-top:20rpx"> |
|||
<view v-for="(item, index) in content_pic" :key="index" class="layui-imgbox"> |
|||
<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="content_pic" v-if="!comment.id"><image :src="event_rul +'/static/img/static/img/ico-del.png'"></image></view> |
|||
<view class="layui-imgbox-img"><image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image></view> |
|||
<!-- <view class="layui-imgbox-repeat" bindtap="xuanzhuan" data-index="{{index}}" data-field="content_pic" wx:if="{{!comment.id}}"><text class="fa fa-repeat"></text></view> --> |
|||
</view> |
|||
<view class="uploadbtn" :style="'background:url('+pre_url+'/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'" @tap="uploadimg" data-field="content_pic" v-if="!comment.id && content_pic.length<5"></view> |
|||
</view> |
|||
</view> |
|||
<button class="subbtn" form-type="submit" v-if="!comment.id">确定</button> |
|||
</form> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
og:{}, |
|||
comment:{}, |
|||
score: 0, |
|||
content_pic: [], |
|||
tempFilePaths: "", |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function () { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
that.loading = true; |
|||
app.get('ApiTuangou/comment', {orderid: orderid}, function (res) { |
|||
that.loading = false; |
|||
that.og = res.og; |
|||
if (res.comment){ |
|||
that.comment = res.comment; |
|||
that.score = res.comment.score; |
|||
var content_pic = res.comment.content_pic; |
|||
that.content_pic = content_pic.split(','); |
|||
} |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
formSubmit: function (e) { |
|||
var that = this; |
|||
var orderid = that.opt.orderid; |
|||
var score = e.detail.value.score; |
|||
var content = e.detail.value.content; |
|||
var content_pic = that.content_pic; |
|||
if (score == 0) { |
|||
app.error('请打分'); |
|||
return; |
|||
} |
|||
if (content == '') { |
|||
app.error('请填写评价内容'); |
|||
return; |
|||
} |
|||
app.showLoading('提交中'); |
|||
app.post('ApiTuangou/comment', {orderid: orderid,content: content,content_pic: content_pic.join(','),score: score}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
app.goback(true); |
|||
}, 2000); |
|||
}); |
|||
}, |
|||
handleClick: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var index = e.currentTarget.dataset.index; |
|||
this.score = index + 1; |
|||
}, |
|||
handleTouchMove: function (e) { |
|||
if (this.comment && this.comment.id) return; |
|||
var clientWidth = uni.getSystemInfoSync().windowWidth; |
|||
if (!e.changedTouches[0]) return; |
|||
var movePageX = e.changedTouches[0].pageX; |
|||
var space = movePageX - 150 / 750 * clientWidth; |
|||
if (space <= 0) return; |
|||
var starwidth = 60 / 750 * clientWidth; |
|||
var setIndex = Math.ceil(space / starwidth); |
|||
setIndex = setIndex > 5 ? 5 : setIndex; |
|||
this.score = setIndex; |
|||
}, |
|||
uploadimg:function(e){ |
|||
var that = this; |
|||
var field= e.currentTarget.dataset.field |
|||
var pics = that[field] |
|||
if(!pics) pics = []; |
|||
app.chooseImage(function(urls){ |
|||
for(var i=0;i<urls.length;i++){ |
|||
pics.push(urls[i]); |
|||
} |
|||
if(field == 'pic') that.pic = pics; |
|||
if(field == 'pics') that.pics = pics; |
|||
if(field == 'zhengming') that.zhengming = pics; |
|||
},1) |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.form-item1{ width:100%;background: #fff; padding: 8rpx 20rpx;} |
|||
.form-item1 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.product{ width: 100%; background: #fff; } |
|||
.product .info{padding-left:20rpx;} |
|||
.product .info .f2{color: #a4a4a4; font-size:24rpx} |
|||
.product .info .f3{color: #ff0d51; font-size:28rpx} |
|||
.product image{ width:140rpx;height:140rpx} |
|||
|
|||
.form-item2{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item2 .label{ width:150rpx;height:60rpx;line-height:60rpx} |
|||
|
|||
.form-item3{width:100%;background: #fff; padding: 8rpx 20rpx;margin-top:1px} |
|||
.form-item3 .label{ width:100%;height:60rpx;line-height:60rpx} |
|||
.form-item3 textarea{width: 100%;border: 1px #dedede solid; border-radius: 10rpx; padding: 10rpx;height: 120rpx;} |
|||
|
|||
|
|||
.form-item4{width:100%;background: #fff; padding: 20rpx 20rpx;margin-top:1px} |
|||
.form-item4 .label{ width:150rpx;} |
|||
/*.form-item4 image{ width: 100rpx; height: 100rpx;background:#eee;margin-right:6rpx} |
|||
.form-item4 .imgbox{height:100rpx}*/ |
|||
|
|||
.subbtn{ width: 90%; margin: 0 5%;margin-top:40rpx; height: 40px; line-height: 40px; color: #fff; background: #e94745; } |
|||
|
|||
.i-rate{margin:0;padding:0;display:inline-block;vertical-align:middle;} |
|||
.i-rate-hide-input{display:none} |
|||
.i-rate-star{display:inline-block;color:#e9e9e9;padding:0 10rpx} |
|||
.i-rate-star image{width:50rpx;height:50rpx} |
|||
.i-rate-current{color:#f5a623} |
|||
.i-rate-text{display:inline-block;vertical-align:middle;margin-left:6px;font-size:14px} |
|||
|
|||
.layui-imgbox{margin-right:16rpx;margin-bottom:10rpx;font-size:24rpx;position: relative;} |
|||
.layui-imgbox-close{position: absolute;display: block;width:32rpx;height:32rpx;right:-16rpx;top:-16rpx;color:#999;font-size:32rpx;background:#fff} |
|||
.layui-imgbox-close image{width:100%;height:100%} |
|||
.layui-imgbox-img{display: block;width:200rpx;height:200rpx;padding:2px;border: #d3d3d3 1px solid;background-color: #f6f6f6;overflow:hidden} |
|||
.layui-imgbox-img>image{max-width:100%;} |
|||
.layui-imgbox-repeat{position: absolute;display: block;width:32rpx;height:32rpx;line-height:28rpx;right: 2px;bottom:2px;color:#999;font-size:30rpx;background:#fff} |
|||
.uploadbtn{position:relative;height:200rpx;width:200rpx} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<view class="comment"> |
|||
<view v-for="(item, index) in datalist" :key="index" class="item"> |
|||
<view class="f1"> |
|||
<image class="t1" :src="item.headimg"/> |
|||
<view class="t2">{{item.nickname}}</view> |
|||
<view class="flex1"></view> |
|||
<view class="t3"><image class="img" v-for="(item2,index2) in [0,1,2,3,4]" :src="event_rul +'/static/img/static/img/star' + (item.score>item2?'2':'') + '.png'"/></view> |
|||
</view> |
|||
<view style="color:#777;font-size:22rpx;">{{item.createtime}}</view> |
|||
<view class="f2"> |
|||
<text class="t1">{{item.content}}</text> |
|||
<view class="t2"> |
|||
<block v-if="item.content_pic!=''"> |
|||
<block v-for="(itemp, index) in item.content_pic" :key="index"> |
|||
<view @tap="previewImage" :data-url="itemp" :data-urls="item.content_pic"> |
|||
<image :src="itemp" mode="widthFix"/> |
|||
</view> |
|||
</block> |
|||
</block> |
|||
</view> |
|||
</view> |
|||
<view class="f3" v-if="item.reply_content"> |
|||
<view class="arrow"></view> |
|||
<view class="t1">商家回复:{{item.reply_content}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<nomore v-if="nomore"></nomore> |
|||
<nodata v-if="nodata" text="暂无评价~"></nodata> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
datalist: [], |
|||
pagenum: 1, |
|||
nomore: false, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
}; |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
onReachBottom: function () { |
|||
if (!this.nodata && !this.nomore) { |
|||
this.pagenum = this.pagenum + 1; |
|||
this.getdata(true); |
|||
} |
|||
}, |
|||
methods: { |
|||
getdata: function (loadmore) { |
|||
if(!loadmore){ |
|||
this.pagenum = 1; |
|||
this.datalist = []; |
|||
} |
|||
var that = this; |
|||
var pagenum = that.pagenum; |
|||
that.loading = true; |
|||
that.nodata = false; |
|||
that.nomore = false; |
|||
app.post('ApiTuangou/commentlist', {proid: that.opt.proid,pagenum: pagenum}, function (res) { |
|||
that.loading = false; |
|||
var data = res.data; |
|||
if (pagenum == 1) { |
|||
that.datalist = data; |
|||
if (data.length == 0) { |
|||
that.nodata = true; |
|||
} |
|||
that.loaded(); |
|||
}else{ |
|||
if (data.length == 0) { |
|||
that.nomore = true; |
|||
} else { |
|||
var datalist = that.datalist; |
|||
var newdata = datalist.concat(data); |
|||
that.datalist = newdata; |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.container{background:#fff} |
|||
.comment{display:flex;flex-direction:column;padding:10rpx 0;} |
|||
.comment .item{background-color:#fff;padding:10rpx 20rpx;display:flex;flex-direction:column;} |
|||
.comment .item .f1{display:flex;width:100%;align-items:center;padding:10rpx 0;} |
|||
.comment .item .f1 .t1{width:70rpx;height:70rpx;border-radius:50%;} |
|||
.comment .item .f1 .t2{padding-left:10rpx;color:#333;font-weight:bold;font-size:30rpx;} |
|||
.comment .item .f1 .t3{text-align:right;} |
|||
.comment .item .f1 .t3 .img{width:24rpx;height:24rpx;margin-left:10rpx} |
|||
.comment .item .score{ font-size: 24rpx;color:#f99716;} |
|||
.comment .item .score image{ width: 140rpx; height: 50rpx; vertical-align: middle; margin-bottom:6rpx; margin-right: 6rpx;} |
|||
.comment .item .f2{display:flex;flex-direction:column;width:100%;padding:10rpx 0;} |
|||
.comment .item .f2 .t1{color:#333;font-size:28rpx;} |
|||
.comment .item .f2 .t2{display:flex;width:100%} |
|||
.comment .item .f2 .t2 image{width:100rpx;height:100rpx;margin:10rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f2 .t3{color:#aaa;font-size:24rpx;} |
|||
.comment .item .f3{width:100%;padding:10rpx 0;position:relative} |
|||
.comment .item .f3 .arrow{width: 16rpx;height: 16rpx;background:#eee;transform: rotate(45deg);position:absolute;top:0rpx;left:36rpx} |
|||
.comment .item .f3 .t1{width:100%;border-radius:10rpx;padding:10rpx;font-size:22rpx;color:#888;background:#eee} |
|||
|
|||
</style> |
|||
@ -0,0 +1,338 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<block v-if="isload"> |
|||
<view class="ordertop" :style="'background:url(' + pre_url + '/static/img/ordertop.png);background-size:100%'"> |
|||
<view class="f1" v-if="detail.status==0"> |
|||
<view class="t1">等待买家付款</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==1"> |
|||
<view class="t1">{{detail.paytype=='货到付款' ? '已选择货到付款' : '已成功付款'}}</view> |
|||
<view class="t2" v-if="detail.freight_type!=1">我们会尽快为您发货</view> |
|||
<view class="t2" v-if="detail.freight_type==1">请尽快前往自提地点取货</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==2"> |
|||
<view class="t1">订单已发货</view> |
|||
<text class="t2" user-select="true">发货信息:{{detail.express_com}} {{detail.express_no}}</text> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==3"> |
|||
<view class="t1">订单已完成</view> |
|||
</view> |
|||
<view class="f1" v-if="detail.status==4"> |
|||
<view class="t1">订单已取消</view> |
|||
</view> |
|||
</view> |
|||
<view class="address"> |
|||
<view class="img"> |
|||
<image :src="event_rul +'/static/img/static/img/address3.png'"></image> |
|||
</view> |
|||
<view class="info"> |
|||
<text class="t1" user-select="true">{{detail.linkman}} {{detail.tel}}</text> |
|||
<text class="t2" v-if="detail.freight_type!=1" user-select="true">地址:{{detail.area}}{{detail.address}}</text> |
|||
<text class="t2" v-if="detail.freight_type==1" @tap="openMendian" :data-storeinfo="storeinfo" :data-latitude="storeinfo.latitude" :data-longitude="storeinfo.longitude" user-select="true">取货地点:{{storeinfo.name}} - {{storeinfo.address}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btitle flex-y-center" v-if="detail.bid>0"> |
|||
<image :src="detail.binfo.logo" style="width:36rpx;height:36rpx;" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid"></image> |
|||
<text class="flex1" decode="true" space="true" @tap="goto" :data-url="'/pages/business/index?id=' + detail.bid" style="padding-left:16rpx">{{detail.binfo.name}}</text> |
|||
</view> |
|||
|
|||
<view class="product"> |
|||
<view class="content"> |
|||
<view @tap="goto" :data-url="'product?id=' + detail.proid"> |
|||
<image :src="detail.propic"></image> |
|||
</view> |
|||
<view class="detail"> |
|||
<text class="t1">{{detail.proname}}</text> |
|||
<view class="t3"><text class="x1 flex1">¥{{detail.sell_price}}</text><text class="x2">×{{detail.num}}</text></view> |
|||
</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==0 && tuangouset.comment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">去评价</view> |
|||
<view class="btn3" v-if="detail.status==3 && detail.iscomment==1" @tap.stop="goto" :data-url="'comment?orderid=' + detail.id">查看评价</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.status==3 || detail.status==2) && (detail.freight_type==3 || detail.freight_type==4)"> |
|||
<view class="item flex-col"> |
|||
<text class="t1" style="color:#111">发货信息</text> |
|||
<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true">{{detail.freight_content}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">订单编号</text> |
|||
<text class="t2" user-select="true">{{detail.ordernum}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">下单时间</text> |
|||
<text class="t2">{{detail.createtime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>0 && detail.paytime"> |
|||
<text class="t1">支付时间</text> |
|||
<text class="t2">{{detail.paytime}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status>1 && detail.send_time"> |
|||
<text class="t1">发货时间</text> |
|||
<text class="t2">{{detail.send_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.status==3 && detail.collect_time"> |
|||
<text class="t1">收货时间</text> |
|||
<text class="t2">{{detail.collect_time}}</text> |
|||
</view> |
|||
</view> |
|||
<view class="orderinfo"> |
|||
<view class="item"> |
|||
<text class="t1">商品金额</text> |
|||
<text class="t2 red">¥{{detail.product_price}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.leveldk_money > 0"> |
|||
<text class="t1">{{t('会员')}}折扣</text> |
|||
<text class="t2 red">-¥{{detail.leveldk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">配送方式</text> |
|||
<text class="t2">{{detail.freight_text}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.freight_time"> |
|||
<text class="t1">{{detail.freight_type!=1?'配送':'提货'}}时间</text> |
|||
<text class="t2">{{detail.freight_time}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.coupon_money > 0"> |
|||
<text class="t1">{{t('优惠券')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.coupon_money}}</text> |
|||
</view> |
|||
|
|||
<view class="item" v-if="detail.scoredk_money > 0"> |
|||
<text class="t1">{{t('积分')}}抵扣</text> |
|||
<text class="t2 red">-¥{{detail.scoredk_money}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="t1">预付款</text> |
|||
<text class="t2 red">¥{{detail.totalprice}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.tuimoney > 0"> |
|||
<text class="t1">已退款</text> |
|||
<text class="t2 red">¥{{detail.tuimoney}}</text> |
|||
</view> |
|||
<view class="item" v-if="detail.tuimoney > 0"> |
|||
<text class="t1">实付金额</text> |
|||
<text class="t2 red">¥{{detail.real_price}}</text> |
|||
</view> |
|||
|
|||
<view class="item"> |
|||
<text class="t1">订单状态</text> |
|||
<text class="t2" v-if="detail.status==0">未付款</text> |
|||
<text v-if="detail.status==1 && detail.freight_type!=1" class="t2">待发货</text> |
|||
<text v-if="detail.status==1 && detail.freight_type==1" class="t2">待提货</text> |
|||
<text class="t2" v-if="detail.status==2">已发货</text> |
|||
<text class="t2" v-if="detail.status==3">已收货</text> |
|||
<text class="t2" v-if="detail.status==4">已关闭</text> |
|||
</view> |
|||
<view class="item" v-if="detail.refund_status>0"> |
|||
<text class="t1">退款状态</text> |
|||
<text class="t2 red" v-if="detail.refund_status==1">审核中,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==2">已退款,¥{{detail.refund_money}}</text> |
|||
<text class="t2 red" v-if="detail.refund_status==3">已驳回,¥{{detail.refund_money}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="orderinfo" v-if="(detail.formdata).length > 0"> |
|||
<view class="item" v-for="item in detail.formdata"> |
|||
<text class="t1">{{item[0]}}</text> |
|||
<view class="t2" v-if="item[2]=='upload'"><image :src="item[1]" style="width:400rpx;height:auto" mode="widthFix" @tap="previewImage" :data-url="item[1]"/></view> |
|||
<text class="t2" v-else user-select="true">{{item[1]}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width:100%;height:160rpx"></view> |
|||
|
|||
<view class="bottom notabbarbot" v-if="detail.status!=3"> |
|||
<block v-if="detail.status==0"> |
|||
<view class="btn2" @tap="toclose" :data-id="detail.id">关闭订单</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="goto" :data-url="'/pages/pay/pay?id=' + detail.payorderid">去付款</view> |
|||
</block> |
|||
<block v-if="detail.status==1"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.real_price">申请退款</view> |
|||
</block> |
|||
<block v-if="detail.status==2 || detail.status==3"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/logistics?express_com=' + detail.express_com + '&express_no=' + detail.express_no" v-if="detail.freight_type!=3 && detail.freight_type!=4">查看物流</view> |
|||
</block> |
|||
|
|||
<block v-if="detail.status==2"> |
|||
<view v-if="detail.refund_status==0 || detail.refund_status==3" class="btn2" @tap="goto" :data-url="'refund?orderid=' + detail.id + '&price=' + detail.real_price">申请退款</view> |
|||
<view class="btn1" :style="{background:t('color1')}" @tap="orderCollect" :data-id="detail.id">确认收货</view> |
|||
</block> |
|||
<block v-if="([1,2,3]).includes(detail.status) && invoice"> |
|||
<view class="btn2" @tap="goto" :data-url="'/pages/order/invoice?type=tuangou&orderid=' + detail.id">发票</view> |
|||
</block> |
|||
<block v-if="(detail.status==1 || detail.status==2) && detail.freight_type==1"> |
|||
<view class="btn2" @tap="showhxqr">核销码</view> |
|||
</block> |
|||
<block v-if="detail.status==3"> |
|||
<view class="btn2">已完成</view> |
|||
</block> |
|||
<block v-if="detail.status==4"> |
|||
<view class="btn2" @tap="todel" :data-id="detail.id">删除订单</view> |
|||
</block> |
|||
</view> |
|||
<uni-popup id="dialogHxqr" ref="dialogHxqr" type="dialog"> |
|||
<view class="hxqrbox"> |
|||
<image :src="detail.hexiao_qr" @tap="previewImage" :data-url="detail.hexiao_qr" class="img"/> |
|||
<view class="txt">请出示核销码给核销员进行核销</view> |
|||
<view class="close" @tap="closeHxqr"> |
|||
<image :src="event_rul +'/static/img/static/img/close2.png'" style="width:100%;height:100%"/> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</block> |
|||
<loading v-if="loading"></loading> |
|||
<dp-tabbar :opt="opt"></dp-tabbar> |
|||
<popmsg ref="popmsg"></popmsg> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
var app = getApp(); |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
opt:{}, |
|||
loading:false, |
|||
isload: false, |
|||
menuindex:-1, |
|||
|
|||
pre_url:app.globalData.pre_url, |
|||
detail:{}, |
|||
team:{}, |
|||
storeinfo:{}, |
|||
tuangouset:{}, |
|||
invoice:0, |
|||
|
|||
event_rul: app.globalData.event_url, |
|||
} |
|||
}, |
|||
|
|||
onLoad: function (opt) { |
|||
this.opt = app.getopts(opt); |
|||
this.getdata(); |
|||
}, |
|||
onPullDownRefresh: function () { |
|||
this.getdata(); |
|||
}, |
|||
methods: { |
|||
getdata: function (option) { |
|||
var that = this; |
|||
that.loading = true; |
|||
app.get('ApiTuangou/orderdetail', {id: that.opt.id}, function (res) { |
|||
that.loading = false; |
|||
that.detail = res.detail; |
|||
that.team = res.team; |
|||
that.storeinfo = res.storeinfo; |
|||
that.tuangouset = res.tuangouset; |
|||
that.invoice = res.invoice; |
|||
that.loaded(); |
|||
}); |
|||
}, |
|||
todel: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要删除该订单吗?', function () { |
|||
app.showLoading('删除中'); |
|||
app.post('ApiTuangou/delOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
toclose: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要关闭该订单吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiTuangou/closeOrder', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
orderCollect: function (e) { |
|||
var that = this; |
|||
var orderid = e.currentTarget.dataset.id; |
|||
app.confirm('确定要收货吗?', function () { |
|||
app.showLoading('提交中'); |
|||
app.post('ApiTuangou/orderCollect', {orderid: orderid}, function (data) { |
|||
app.showLoading(false); |
|||
app.success(data.msg); |
|||
setTimeout(function () { |
|||
that.getdata(); |
|||
}, 1000); |
|||
}); |
|||
}); |
|||
}, |
|||
showhxqr:function(){ |
|||
this.$refs.dialogHxqr.open(); |
|||
}, |
|||
closeHxqr:function(){ |
|||
this.$refs.dialogHxqr.close(); |
|||
}, |
|||
openMendian: function(e) { |
|||
var storeinfo = e.currentTarget.dataset.storeinfo; |
|||
app.goto('/pages/shop/mendian?id=' + storeinfo.id); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
<style> |
|||
.ordertop{width:100%;height:220rpx;padding:50rpx 0 0 70rpx} |
|||
.ordertop .f1{color:#fff} |
|||
.ordertop .f1 .t1{font-size:32rpx;height:60rpx;line-height:60rpx} |
|||
.ordertop .f1 .t2{font-size:24rpx} |
|||
|
|||
.address{ display:flex;width: 100%; padding: 20rpx 3%; background: #FFF;} |
|||
.address .img{width:40rpx} |
|||
.address image{width:40rpx; height:40rpx;} |
|||
.address .info{flex:1;display:flex;flex-direction:column;} |
|||
.address .info .t1{font-size:28rpx;font-weight:bold;color:#333} |
|||
.address .info .t2{font-size:24rpx;color:#999} |
|||
|
|||
.product{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.product .content{display:flex;position:relative;width: 100%; padding:16rpx 0px;border-bottom: 1px #e5e5e5 dashed;position:relative} |
|||
.product .content:last-child{ border-bottom: 0; } |
|||
.product .content image{ width: 140rpx; height: 140rpx;} |
|||
.product .content .detail{display:flex;flex-direction:column;margin-left:14rpx;flex:1} |
|||
.product .content .detail .t1{font-size:26rpx;line-height:36rpx;margin-bottom:10rpx;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;} |
|||
.product .content .detail .t2{height: 46rpx;line-height: 46rpx;color: #999;overflow: hidden;font-size: 26rpx;} |
|||
.product .content .detail .t3{display:flex;height:40rpx;line-height:40rpx;color: #ff4246;} |
|||
.product .content .detail .x1{ flex:1} |
|||
.product .content .detail .x2{ width:100rpx;font-size:32rpx;text-align:right;margin-right:8rpx} |
|||
.product .content .comment{position:absolute;top:64rpx;right:10rpx;border: 1px #ffc702 solid; border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
.orderinfo{width:94%;margin:0 3%;border-radius:8rpx;margin-top:16rpx;padding: 14rpx 3%;background: #FFF;} |
|||
.orderinfo .item{display:flex;width:100%;padding:20rpx 0;border-bottom:1px dashed #ededed;} |
|||
.orderinfo .item:last-child{ border-bottom: 0;} |
|||
.orderinfo .item .t1{width:200rpx;} |
|||
.orderinfo .item .t2{flex:1;text-align:right} |
|||
.orderinfo .item .red{color:red} |
|||
|
|||
.bottom{ width: 100%; height:92rpx;padding: 0 20rpx;background: #fff; position: fixed; bottom: 0px; left: 0px;display:flex;justify-content:flex-end;align-items:center;} |
|||
.btn1{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#fff;border-radius:3px;text-align:center} |
|||
.btn2{margin-left:20rpx;width:160rpx;height:60rpx;line-height:60rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.btn3{position:absolute;top:60rpx;right:10rpx;font-size:24rpx;width:120rpx;height:50rpx;line-height:50rpx;color:#333;background:#fff;border:1px solid #cdcdcd;border-radius:3px;text-align:center} |
|||
.hxqrbox{background:#fff;padding:50rpx;position:relative;border-radius:20rpx} |
|||
.hxqrbox .img{width:400rpx;height:400rpx} |
|||
.hxqrbox .txt{color:#666;margin-top:20rpx;font-size:26rpx;text-align:center} |
|||
.hxqrbox .close{width:50rpx;height:50rpx;position:absolute;bottom:-100rpx;left:50%;margin-left:-25rpx;border:1px solid rgba(255,255,255,0.5);border-radius:50%;padding:8rpx} |
|||
|
|||
|
|||
.btitle{ width:100%;height:100rpx;background:#fff;padding:0 20rpx;border-bottom:1px solid #f5f5f5} |
|||
.btitle .comment{border: 1px #ffc702 solid;border-radius:10rpx;background:#fff; color: #ffc702; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
.btitle .comment2{border: 1px #ffc7c0 solid;border-radius:10rpx;background:#fff; color: #ffc7c0; padding: 0 10rpx; height: 46rpx; line-height: 46rpx;} |
|||
|
|||
</style> |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue