102 changed files with 3682 additions and 722 deletions
@ -1,199 +0,0 @@
|
||||
<template> |
||||
<view class="evaluate-con"> |
||||
<view class="goodsStyle acea-row row-between" v-if="orderCon.productInfo"> |
||||
<view class="pictrue"> |
||||
<image :src="orderCon.productInfo.image" class="image" /> |
||||
</view> |
||||
<view class="text acea-row row-between"> |
||||
<view class="name line2">{{ orderCon.productInfo.storeName }}</view> |
||||
<view class="money"> |
||||
<view>￥{{ orderCon.productInfo.price }}</view> |
||||
<view class="num">x{{ orderCon.cartNum }}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="score"> |
||||
<view |
||||
class="item acea-row row-middle" |
||||
v-for="(item, scoreListIndexw) in scoreList" |
||||
:key="scoreListIndexw" |
||||
> |
||||
<view>{{ item.name }}</view> |
||||
<view class="starsList"> |
||||
<text |
||||
@click="stars(starsIndexn, scoreListIndexw)" |
||||
v-for="(itemn, starsIndexn) in item.stars" |
||||
:key="starsIndexn" |
||||
class="iconfont" |
||||
:class="item.index >= starsIndexn ? 'icon-shitixing font-color-red': 'icon-kongxinxing'" |
||||
></text> |
||||
</view> |
||||
<text class="evaluate">{{item.index === -1 ? "" : item.index + 1 + "分"}}</text> |
||||
</view> |
||||
<view class="textarea"> |
||||
<textarea placeholder="商品满足你的期待么？说说你的想法，分享给想买的他们吧~" v-model="expect"></textarea> |
||||
<view class="list acea-row row-middle"> |
||||
<view |
||||
class="pictrue" |
||||
v-for="(item, uploadPicturesIndex) in uploadPictures" |
||||
:key="uploadPicturesIndex" |
||||
> |
||||
<image :src="item" /> |
||||
<text |
||||
class="iconfont icon-guanbi1 font-color-red" |
||||
@click="uploadPictures.splice(uploadPicturesIndex, 1)" |
||||
></text> |
||||
</view> |
||||
<view class="pictrue uploadBnt acea-row row-center-wrapper row-column" @tap="chooseImage"> |
||||
<text class="iconfont icon-icon25201"></text> |
||||
<view>上传图片</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="evaluateBnt bg-color-red" @click="submit">立即评价</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
<style scoped lang="less"> |
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt { |
||||
border: 1px solid #ddd; |
||||
} |
||||
</style> |
||||
<script> |
||||
import { postOrderProduct, postOrderComment } from "@/api/store"; |
||||
import { trim, chooseImage } from "@/utils"; |
||||
import { VUE_APP_API_URL } from "@/config"; |
||||
import { required } from "@/utils/validate"; |
||||
import { validatorDefaultCatch } from "@/utils/dialog"; |
||||
|
||||
const NAME = "GoodsEvaluate"; |
||||
|
||||
export default { |
||||
name: NAME, |
||||
components: { |
||||
// VueCoreImageUpload |
||||
}, |
||||
props: {}, |
||||
data: function() { |
||||
return { |
||||
orderCon: { |
||||
cartProduct: { |
||||
productInfo: {} |
||||
} |
||||
}, |
||||
scoreList: [ |
||||
{ |
||||
name: "商品质量", |
||||
stars: ["", "", "", "", ""], |
||||
index: -1 |
||||
}, |
||||
{ |
||||
name: "服务态度", |
||||
stars: ["", "", "", "", ""], |
||||
index: -1 |
||||
} |
||||
], |
||||
uploadPictures: [], |
||||
expect: "", |
||||
unique: "" |
||||
}; |
||||
}, |
||||
mounted: function() { |
||||
this.unique = this.$yroute.query.id; |
||||
this.getOrderProduct(); |
||||
}, |
||||
watch: { |
||||
$yroute(n) { |
||||
if (n.name === NAME && this.unique !== n.params.id) { |
||||
this.unique = n.params.id; |
||||
this.$set(this.scoreList[0], "index", -1); |
||||
this.$set(this.scoreList[1], "index", -1); |
||||
this.expect = ""; |
||||
this.uploadPictures = []; |
||||
this.getOrderProduct(); |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
getOrderProduct: function() { |
||||
let that = this, |
||||
unique = that.unique; |
||||
postOrderProduct(unique).then(res => { |
||||
that.orderCon = res.data; |
||||
}); |
||||
}, |
||||
stars: function(indexn, indexw) { |
||||
this.scoreList[indexw].index = indexn; |
||||
}, |
||||
chooseImage() { |
||||
chooseImage(img => { |
||||
this.uploadPictures.push(img); |
||||
}); |
||||
}, |
||||
async submit() { |
||||
const expect = trim(this.expect), |
||||
product_score = |
||||
this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1, |
||||
service_score = |
||||
this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1; |
||||
try { |
||||
await this.$validator({ |
||||
product_score: [ |
||||
required("请选择商品质量分数", { |
||||
type: "number" |
||||
}) |
||||
], |
||||
service_score: [ |
||||
required("请选择服务态度分数", { |
||||
type: "number" |
||||
}) |
||||
] |
||||
}).validate({ |
||||
product_score, |
||||
service_score |
||||
}); |
||||
} catch (e) { |
||||
return validatorDefaultCatch(e); |
||||
} |
||||
postOrderComment({ |
||||
productScore: product_score, |
||||
serviceScore: service_score, |
||||
unique: this.unique, |
||||
pics: this.uploadPictures.join(","), |
||||
comment: expect |
||||
}) |
||||
.then(() => { |
||||
uni.showToast({ |
||||
title: "评价成功", |
||||
icon: "success", |
||||
duration: 2000 |
||||
}); |
||||
|
||||
// ? 回跳到上一页 |
||||
this.$yrouter.back(); |
||||
|
||||
// ? 默认跳转到详情页 |
||||
// this.$yrouter.push({ |
||||
// path: "/pages/order/OrderDetails/index", |
||||
// query: { |
||||
// id: this.orderCon.orderId |
||||
// } |
||||
// }); |
||||
|
||||
// ? 可选重定向到详情页，这时左上角会有一个返回首页的图标 |
||||
// this.$yrouter.reLaunch({ |
||||
// path: "/pages/home/index", |
||||
// }); |
||||
}) |
||||
.catch(err => { |
||||
uni.showToast({ |
||||
title: |
||||
err.msg || err.response.data.msg || err.response.data.message, |
||||
icon: "none", |
||||
duration: 2000 |
||||
}); |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
@ -0,0 +1,78 @@
|
||||
<template> |
||||
<view class="dabang-share-box" v-else> |
||||
<view class="dabang-share-item" v-for="(item,index) in 6" :key="index"> |
||||
<view class="user-info-box acea-row row-middle"> |
||||
<view class="header-img"> |
||||
<image src="../../static/img1.png" mode=""></image> |
||||
</view> |
||||
<view class="acea-row row-column row-center"> |
||||
<view class="name">失宠的猫咪</view> |
||||
<view class="create-time">5小时前</view> |
||||
</view> |
||||
</view> |
||||
<view class="share-word"> |
||||
抱朴书院孕育自华夏优秀传统文化，以“博学致用，朴含虚”为院训，以“弘扬国粹… |
||||
</view> |
||||
<view class="img-box acea-row row-around"> |
||||
<image src="../../static/img1.png"></image> |
||||
<image src="../../static/img1.png"></image> |
||||
<image src="../../static/img1.png"></image> |
||||
</view> |
||||
<view class="zan-box acea-row row-middle row-right"> |
||||
<image src="../../static/zan.png"></image> |
||||
<text class="zan-conunt">55</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.dabang-share-box{ |
||||
width: 100%; |
||||
padding: 30rpx; |
||||
background-color: #fff; |
||||
.dabang-share-item{ |
||||
color: #222; |
||||
padding:20rpx 0; |
||||
border-bottom: 1px solid #ececec; |
||||
.header-img{ |
||||
width: 76rpx; |
||||
height: 76rpx; |
||||
border-radius: 50%; |
||||
overflow: hidden; |
||||
margin-right: 10rpx; |
||||
} |
||||
.name{ |
||||
font-size: 28rpx; |
||||
line-height: 40rpx; |
||||
} |
||||
.create-time{ |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
line-height: 34rpx; |
||||
} |
||||
.share-word{ |
||||
font-size: 28rpx; |
||||
line-height: 46rpx; |
||||
margin: 22rpx 0 30rpx; |
||||
} |
||||
.img-box{ |
||||
image{ |
||||
width: 224rpx; |
||||
height: 206rpx; |
||||
} |
||||
} |
||||
.zan-box{ |
||||
margin-top: 20rpx; |
||||
image{ |
||||
width: 30rpx; |
||||
height: 32rpx; |
||||
margin-right: 20rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,359 @@
|
||||
<template> |
||||
<view class="dabang-index"> |
||||
<view class="top-box"> |
||||
<view class="dabang-name">连续21天打榜站桩</view> |
||||
<view class="desc">抱朴书院孕育自华夏优秀传统文化，以“博学致用，朴含虚”为院训，以“弘扬国粹，利益社会”为动力。</view> |
||||
<view class="time-box"> |
||||
<span>时间：2021年5月31日 - 2021年6月20日（共21天）</span> |
||||
<view class="sanjiao"></view> |
||||
</view> |
||||
</view> |
||||
<view class="join-num">参与人数：231人</view> |
||||
<view class="my-progress-box"> |
||||
<view class="t-word acea-row row-between-wrapper"> |
||||
<text>我的进度</text> |
||||
<view> |
||||
<text class="to-more" @click="toMyBangdan">我的打榜日记</text> |
||||
<text class="iconfont icon-jiantou"></text> |
||||
</view> |
||||
</view> |
||||
<view class="progress-info-box acea-row-nowrap row-between"> |
||||
<view class="acea-row"> |
||||
<view class="user-headerimg"> |
||||
<image src="../../static/img1.png" mode=""></image> |
||||
</view> |
||||
<view class="user-progress"> |
||||
<view class="name">失宠的猫咪</view> |
||||
<view class="progress"> |
||||
<view class="pro-icon"><image src="../../static/course-icon2.png" mode=""></image></view> |
||||
已坚持<text class="colO">7</text>/21 |
||||
</view> |
||||
<view class="progress"> |
||||
<view class="pro-icon"><image src="../../static/course-icon4.png" mode=""></image></view> |
||||
完成进度<text class="colO">33</text>% |
||||
</view> |
||||
<view class="progress"> |
||||
<view class="pro-icon"><image src="../../static/course-icon3.png" mode=""></image></view> |
||||
全榜排名<text class="colO">12</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="progress-r acea-row row-column row-center-wrapper"> |
||||
<text>今日未打榜</text> |
||||
<view class="dabang-btn" @click="toEdit">立即打卡</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="tab-box acea-row row-middle"> |
||||
<view class="tab-item" :class="active == 0 ? 'tab-item-a' : ''" @click="tabClick(0)">打榜分享</view> |
||||
<view class="tab-item" :class="active == 1 ? 'tab-item-a' : ''" @click="tabClick(1)">排行榜</view> |
||||
</view> |
||||
<!-- 排行榜 --> |
||||
<view class="rank-list" v-if="active == 1"> |
||||
<view class="rank-item acea-row row-between-wrapper" v-for="(item,index) in 6" :key="index"> |
||||
<view class="acea-row row-middle"> |
||||
<view class="ranking">{{index+1}}</view> |
||||
<view class="header-img"><image src="../../static/img1.png" mode=""></image></view> |
||||
<view class="name">失宠的猫咪</view> |
||||
</view> |
||||
<view class="acea-row row-column row-center-wrapper"> |
||||
<view>完成打榜30项</view> |
||||
<view class="jifen">3000积分</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<!-- 打榜分享 --> |
||||
<view class="dabang-share-box" v-else> |
||||
<view class="dabang-share-item" v-for="(item,index) in 6" :key="index"> |
||||
<view class="user-info-box acea-row row-middle"> |
||||
<view class="header-img"> |
||||
<image src="../../static/img1.png" mode=""></image> |
||||
</view> |
||||
<view class="acea-row row-column row-center"> |
||||
<view class="name">失宠的猫咪</view> |
||||
<view class="create-time">5小时前</view> |
||||
</view> |
||||
</view> |
||||
<view class="share-word"> |
||||
抱朴书院孕育自华夏优秀传统文化，以“博学致用，朴含虚”为院训，以“弘扬国粹… |
||||
</view> |
||||
<view class="img-box acea-row row-around"> |
||||
<image src="../../static/img1.png"></image> |
||||
<image src="../../static/img1.png"></image> |
||||
<image src="../../static/img1.png"></image> |
||||
</view> |
||||
<view class="zan-box acea-row row-middle row-right"> |
||||
<image src="../../static/zan.png"></image> |
||||
<text class="zan-conunt">55</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return { |
||||
active: 0 |
||||
} |
||||
}, |
||||
methods:{ |
||||
tabClick(idx){ |
||||
this.active = idx; |
||||
}, |
||||
toMyBangdan(){ |
||||
this.$yrouter.push({ |
||||
path:'/pages/study/bangdanRecord' |
||||
}) |
||||
}, |
||||
toEdit(){ |
||||
this.$yrouter.push({ |
||||
path:'/pages/study/editDabang' |
||||
}) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.dabang-index{ |
||||
min-height: 100vh; |
||||
background: #fff; |
||||
padding-bottom: 100rpx; |
||||
.top-box{ |
||||
width: 100%; |
||||
height: 396rpx; |
||||
background: linear-gradient(135deg, #E5B964 0%, #CE9F45 100%); |
||||
box-sizing: border-box; |
||||
padding: 40rpx 0; |
||||
color: #fff; |
||||
position: relative; |
||||
.dabang-name{ |
||||
width: 80%; |
||||
font-size: 50rpx; |
||||
font-weight: 600; |
||||
color: #FFFFFF; |
||||
line-height: 72rpx; |
||||
margin: 40rpx auto; |
||||
} |
||||
.desc{ |
||||
width: 80%; |
||||
margin: 0 auto; |
||||
font-size: 24rpx; |
||||
color: #FFFFFF; |
||||
line-height: 36rpx; |
||||
text-indent: 2em; |
||||
} |
||||
.time-box{ |
||||
width: 100%; |
||||
height: 78rpx; |
||||
line-height: 78rpx; |
||||
background: rgba(0,0,0,.1); |
||||
font-size: 28rpx; |
||||
position: absolute; |
||||
bottom: 0; |
||||
text-indent: 1em; |
||||
} |
||||
.sanjiao{ |
||||
width:0; |
||||
height:0; |
||||
border-right:14rpx solid transparent; |
||||
border-left:14rpx solid transparent; |
||||
border-bottom:16rpx solid #fff; |
||||
position: absolute; |
||||
left: 50%; |
||||
top: 64rpx; |
||||
transform: translateX(-50%); |
||||
} |
||||
} |
||||
.join-num{ |
||||
width: 406rpx; |
||||
height: 58rpx; |
||||
background: #FFF2DA; |
||||
border-radius: 46rpx; |
||||
margin: 30rpx auto; |
||||
text-align: center; |
||||
line-height: 58rpx; |
||||
color: #E49600; |
||||
} |
||||
.my-progress-box{ |
||||
width: 100%; |
||||
box-sizing: border-box; |
||||
padding: 30rpx; |
||||
font-size: 36rpx; |
||||
color: #222; |
||||
.t-word{ |
||||
font-size: 36rpx; |
||||
color: #222; |
||||
font-weight: 600; |
||||
.to-more{ |
||||
font-size: 28rpx; |
||||
color: #666; |
||||
font-weight: normal; |
||||
} |
||||
.iconfont{ |
||||
font-size: 30rpx; |
||||
} |
||||
} |
||||
.progress-info-box{ |
||||
margin-top: 30rpx; |
||||
width: 690rpx; |
||||
height: 280rpx; |
||||
background: #FFFFFF; |
||||
box-shadow: 0px 4px 8px 0px rgba(239,239,239,0.5); |
||||
border-radius: 10rpx; |
||||
padding: 30rpx; |
||||
.user-headerimg{ |
||||
width: 130rpx; |
||||
height: 130rpx; |
||||
margin-right: 20rpx; |
||||
image{ |
||||
width: 100%; |
||||
height: 100%; |
||||
border-radius: 50px; |
||||
} |
||||
} |
||||
.user-progress{ |
||||
font-size: 28rpx; |
||||
.name{ |
||||
font-size: 32rpx; |
||||
font-weight: 500; |
||||
color: #222222; |
||||
line-height: 44rpx; |
||||
} |
||||
.colO{ |
||||
font-size: 40rpx; |
||||
color: #F36F5E; |
||||
} |
||||
.progress{ |
||||
display: flex; |
||||
align-items: center; |
||||
.pro-icon{ |
||||
width: 32rpx; |
||||
height: 32rpx; |
||||
margin-right: 10rpx; |
||||
image{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.progress-r{ |
||||
font-size: 24rpx; |
||||
color: #666; |
||||
.dabang-btn{ |
||||
width: 160rpx; |
||||
height: 56rpx; |
||||
background: linear-gradient(180deg, #F7D08E 0%, #E2B35D 100%); |
||||
border-radius: 35rpx; |
||||
text-align: center; |
||||
line-height: 56rpx; |
||||
color: #fff; |
||||
font-size: 28rpx; |
||||
margin-top: 10rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.tab-box{ |
||||
width: 100%; |
||||
padding: 0rpx 30rpx; |
||||
font-size: 36rpx; |
||||
color: #222; |
||||
.tab-item{ |
||||
width: 50%; |
||||
text-align: center; |
||||
border-bottom: 1px solid #ECECEC; |
||||
padding: 20rpx 0; |
||||
} |
||||
.tab-item-a{ |
||||
color: #EA533E; |
||||
border-bottom: 1px solid #EA533E; |
||||
} |
||||
} |
||||
|
||||
.rank-list{ |
||||
width: 100%; |
||||
padding: 0rpx 30rpx; |
||||
.rank-item{ |
||||
width: 100%; |
||||
padding: 32rpx 0; |
||||
border-bottom: 1px solid #ececec; |
||||
font-size: 28rpx; |
||||
color: #222; |
||||
.ranking{ |
||||
width: 32rpx; |
||||
height: 32rpx; |
||||
border-radius: 50%; |
||||
line-height: 32rpx; |
||||
text-align: center; |
||||
color: #fff; |
||||
font-size: 24rpx; |
||||
background: #EA533E; |
||||
} |
||||
.header-img{ |
||||
width: 82rpx; |
||||
height: 82rpx; |
||||
border-radius: 50px; |
||||
overflow: hidden; |
||||
margin: 0 30rpx 0 22rpx; |
||||
} |
||||
.jifen{ |
||||
color: #E5B764; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.dabang-share-box{ |
||||
width: 100%; |
||||
padding: 30rpx; |
||||
.dabang-share-item{ |
||||
color: #222; |
||||
padding:20rpx 0; |
||||
border-bottom: 1px solid #ececec; |
||||
.header-img{ |
||||
width: 76rpx; |
||||
height: 76rpx; |
||||
border-radius: 50%; |
||||
overflow: hidden; |
||||
margin-right: 10rpx; |
||||
} |
||||
.name{ |
||||
font-size: 28rpx; |
||||
line-height: 40rpx; |
||||
} |
||||
.create-time{ |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
line-height: 34rpx; |
||||
} |
||||
.share-word{ |
||||
font-size: 28rpx; |
||||
line-height: 46rpx; |
||||
margin: 22rpx 0 30rpx; |
||||
} |
||||
.img-box{ |
||||
image{ |
||||
width: 224rpx; |
||||
height: 206rpx; |
||||
} |
||||
} |
||||
.zan-box{ |
||||
margin-top: 20rpx; |
||||
image{ |
||||
width: 30rpx; |
||||
height: 32rpx; |
||||
margin-right: 20rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
image{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,93 @@
|
||||
<template> |
||||
<view class="editdabang-box"> |
||||
<view class="edit-box"> |
||||
<textarea v-model="expect" placeholder="请在此输入文字..." /> |
||||
</view> |
||||
<view class="upload-img-box acea-row row-middle"> |
||||
<view class="pictrue" v-for="(item, uploadPicturesIndex) in uploadPictures" |
||||
:key="uploadPicturesIndex"> |
||||
<image :src="item" /> |
||||
<text class="reduce iconfont icon-guanbi1 font-color-red" |
||||
@click="uploadPictures.splice(uploadPicturesIndex, 1)"></text> |
||||
</view> |
||||
<view class="pictrue uploadBnt acea-row row-center-wrapper row-column" @tap="chooseImage"> |
||||
<text class="iconfont icon-icon25201"></text> |
||||
<view>上传图片</view> |
||||
</view> |
||||
</view> |
||||
<view class="submit-btn">发布</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
chooseImage |
||||
} from "@/utils"; |
||||
export default { |
||||
components: { |
||||
// VueCoreImageUpload |
||||
}, |
||||
data: function() { |
||||
return { |
||||
uploadPictures: [], |
||||
expect: "", |
||||
unique: "" |
||||
}; |
||||
}, |
||||
methods:{ |
||||
chooseImage() { |
||||
chooseImage(img => { |
||||
this.uploadPictures.push(img); |
||||
}); |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.editdabang-box{ |
||||
width: 100%; |
||||
height: 100vh; |
||||
padding: 0 30rpx; |
||||
background: #fff; |
||||
} |
||||
.edit-box{ |
||||
width: 100%; |
||||
padding: 50rpx 0; |
||||
border-bottom: 1px solid #ececec; |
||||
} |
||||
.upload-img-box{ |
||||
margin-top: 50rpx; |
||||
.pictrue{ |
||||
width: 200rpx; |
||||
height: 200rpx; |
||||
border-radius: 10rpx; |
||||
background: #F6F6F6; |
||||
color: #E2B35D; |
||||
position: relative; |
||||
margin-right: 20rpx; |
||||
font-size: 28rpx; |
||||
image{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
.reduce{ |
||||
position: absolute; |
||||
top: -12rpx; |
||||
right: -12rpx; |
||||
} |
||||
} |
||||
} |
||||
.submit-btn{ |
||||
width: 340rpx; |
||||
height: 88rpx; |
||||
background: linear-gradient(180deg, #F7D08E 0%, #E2B35D 100%); |
||||
border-radius: 44rpx; |
||||
text-align: center; |
||||
line-height: 88rpx; |
||||
font-size: 32rpx; |
||||
color: #fff; |
||||
margin: 72rpx auto; |
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,55 @@
|
||||
<template> |
||||
<view class="index"> |
||||
<view class="inp-box"> |
||||
<textarea @input="sumfontnum" maxlength="100" @blur="bindTextAreaBlur" placeholder-style="color:#999999;" placeholder="请填写您宝贵的反馈意见" /> |
||||
<view class="fontnum">{{fontnum}}/100</view> |
||||
</view> |
||||
<view class="submit-btn">提交</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return { |
||||
feedBack:'', |
||||
fontnum:0 |
||||
} |
||||
}, |
||||
methods:{ |
||||
bindTextAreaBlur: function (e) { |
||||
console.log(e.detail.value) |
||||
}, |
||||
sumfontnum(e){ |
||||
this.fontnum = e.detail.value.length |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.inp-box{ |
||||
width: 100%; |
||||
background: #fff; |
||||
padding: 24rpx; |
||||
font-size: 28rpx; |
||||
position: relative; |
||||
.fontnum{ |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
position: absolute; |
||||
right: 28rpx; |
||||
bottom: 16rpx; |
||||
} |
||||
} |
||||
.submit-btn{ |
||||
width: 208rpx; |
||||
height: 80rpx; |
||||
background: #6E85EB; |
||||
color: #fff; |
||||
text-align: center; |
||||
line-height: 80rpx; |
||||
border-radius: 4rpx; |
||||
margin: 30rpx auto; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,8 @@
|
||||
<template> |
||||
</template> |
||||
|
||||
<script> |
||||
</script> |
||||
|
||||
<style> |
||||
</style> |
||||
@ -0,0 +1,98 @@
|
||||
<template> |
||||
<view class="index"> |
||||
<view class="tabs-box acea-row row-around row-middle"> |
||||
<view class="tab-item" :class="active == 0 ? 'tab-item-active' : ''" @click="tabClick(0)">打卡中</view> |
||||
<view class="tab-item" :class="active == 1 ? 'tab-item-active' : ''" @click="tabClick(1)">已完成</view> |
||||
</view> |
||||
<view class="dabang-list-box"> |
||||
<view class="dabang-item"> |
||||
<view class="dabang-info"> |
||||
<view class="bangdan-name line1">连续21天打卡站桩</view> |
||||
<view class="time">2021.5.28-2021.618</view> |
||||
<view class="time">30积分</view> |
||||
</view> |
||||
<view class="dabang-btm acea-row row-between-wrapper"> |
||||
<view>+30积分</view> |
||||
<view>打榜成功</view> |
||||
</view> |
||||
</view> |
||||
<view class="dabang-item"> |
||||
<view class="dabang-info"> |
||||
<view class="bangdan-name line1">连续21天打卡站桩</view> |
||||
<view class="time">2021.5.28-2021.618</view> |
||||
<view class="time">30积分</view> |
||||
</view> |
||||
<view class="dabang-btm colR acea-row row-between-wrapper"> |
||||
<view>-30积分</view> |
||||
<view>打榜失败</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return { |
||||
active : 0 |
||||
} |
||||
}, |
||||
methods:{ |
||||
tabClick(idx){ |
||||
this.active = idx |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.tabs-box{ |
||||
width: 100%; |
||||
height:98rpx; |
||||
font-size: 32rpx; |
||||
color: #222; |
||||
background: #fff; |
||||
border-top: 1px solid #f2f2f2; |
||||
.tab-item{ |
||||
height: 100%; |
||||
line-height: 98rpx; |
||||
} |
||||
.tab-item-active{ |
||||
font-size: 40rpx; |
||||
font-size: 500; |
||||
border-bottom: 4rpx solid #EB5744; |
||||
} |
||||
} |
||||
.dabang-list-box{ |
||||
width: 100%; |
||||
padding: 0 32rpx; |
||||
.dabang-item{ |
||||
width: 100%; |
||||
background: #fff; |
||||
color: #fff; |
||||
margin-top: 28rpx; |
||||
font-size: 28rpx; |
||||
border-radius: 10rpx; |
||||
overflow: hidden; |
||||
.dabang-info{ |
||||
height: 200rpx; |
||||
padding-left: 24rpx; |
||||
padding-top: 24rpx; |
||||
background: linear-gradient(148deg, #B4B6C4 0%, #C5CAD6 100%); |
||||
.bangdan-name{ |
||||
font-size: 50rpx; |
||||
line-height: 80rpx; |
||||
} |
||||
} |
||||
.dabang-btm{ |
||||
padding: 0 56rpx 0 24rpx; |
||||
height: 80rpx; |
||||
color: #8FB85B; |
||||
} |
||||
.colR{ |
||||
color:#EB5744; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,202 @@
|
||||
<template> |
||||
<view class="index"> |
||||
<view class="tabs-box acea-row row-around row-middle"> |
||||
<view class="tab-item" :class="active == 0 ? 'tab-item-active' : ''" @click="tabClick(0)">已报名</view> |
||||
<view class="tab-item" :class="active == 1 ? 'tab-item-active' : ''" @click="tabClick(1)">已完成</view> |
||||
<view class="tab-item" :class="active == 2 ? 'tab-item-active' : ''" @click="tabClick(2)">可报名</view> |
||||
</view> |
||||
<view class="course-list-box" v-if="active == 0 || active == 1"> |
||||
<view class="course-item acea-row row-between"> |
||||
<view class="course-item-l"> |
||||
<view class="course-info"> |
||||
<view class="course-name line1">【一代天骄王者少年】禪易课程教学易课程教学</view> |
||||
<view class="info-box"> |
||||
<view class="">时间：2021.5.25-5.28 8:30-18:30</view> |
||||
<view class="">地点：湖北 武汉</view> |
||||
<view class="">座位号：8排8号</view> |
||||
<view class="">酒店安排：江汉区江汉路22号武汉大酒店0801号房</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="course-item-r acea-row "> |
||||
<view class="saoyisao"><image src="../../../static/saoyisao-icon.png"></image></view> |
||||
<text>去签到</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="knowledge-list" v-else> |
||||
<view class="knowledge-item acea-row" v-for="item in courseList" @click="toDetail(item.id)"> |
||||
<view class="img-box"> |
||||
<image :src="item.imageArr[0]" mode=""></image> |
||||
</view> |
||||
<view class="knowledge-info-box"> |
||||
<view class="title line1">{{item.courseName}}</view> |
||||
<view class="time">{{utils.spl(item.courseStartTime)[0]}}~{{utils.spl(item.courseEndTime)[0]}}</view> |
||||
<view class="address">{{item.coursePlace}}</view> |
||||
<view class="type-box acea-row row-between row-middle"> |
||||
<view class="price">￥{{item.courseCharge}}</view> |
||||
<view class="signin-btn red">去报名</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="knowledge-item acea-row"> |
||||
<view class="img-box"> |
||||
<image src="../../static/img1.png" mode=""></image> |
||||
</view> |
||||
<view class="knowledge-info-box"> |
||||
<view class="title line1">《阴阳五行》一个人的阴阳五的阴阳五行…</view> |
||||
<view class="time">2021-5-31-6.3 8:30-18:30</view> |
||||
<view class="address">中国 武汉</view> |
||||
<view class="type-box acea-row row-between row-middle"> |
||||
<view class="price">￥3000</view> |
||||
<view class="signin-btn red">去报名</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return { |
||||
active : 0 |
||||
} |
||||
}, |
||||
methods:{ |
||||
tabClick(idx){ |
||||
this.active = idx |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.tabs-box{ |
||||
width: 100%; |
||||
height:98rpx; |
||||
font-size: 32rpx; |
||||
color: #222; |
||||
background: #fff; |
||||
border-top: 1px solid #f2f2f2; |
||||
.tab-item{ |
||||
height: 100%; |
||||
line-height: 98rpx; |
||||
} |
||||
.tab-item-active{ |
||||
font-size: 40rpx; |
||||
font-size: 500; |
||||
border-bottom: 4rpx solid #EB5744; |
||||
} |
||||
} |
||||
.course-list-box{ |
||||
width: 100%; |
||||
.course-item{ |
||||
width: 100%; |
||||
background: #fff; |
||||
padding: 24rpx 0 26rpx 30rpx; |
||||
margin-top: 28rpx; |
||||
.course-item-l{ |
||||
width: 526rpx; |
||||
.info-box{ |
||||
font-size: 26rpx; |
||||
color: #666666; |
||||
view{ |
||||
line-height: 34rpx; |
||||
} |
||||
} |
||||
.course-name{ |
||||
color: #333; |
||||
font-size: 32rpx; |
||||
font-weight: 500; |
||||
line-height: 44rpx; |
||||
margin-bottom: 22rpx; |
||||
} |
||||
} |
||||
.course-item-r{ |
||||
width: 182rpx; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
align-items: center; |
||||
color: #EB5744; |
||||
border-left: 1px solid #d8d8d8; |
||||
image{ |
||||
width: 50rpx; |
||||
height: 50rpx; |
||||
margin-bottom: 6rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.knowledge-list { |
||||
width: 100%; |
||||
margin-top: 50rpx; |
||||
.knowledge-item { |
||||
background: #fff; |
||||
padding: 32rpx; |
||||
margin-top: 28rpx; |
||||
.img-box { |
||||
width: 204rpx; |
||||
height: 200rpx; |
||||
margin-right: 30rpx; |
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
.knowledge-info-box { |
||||
width: calc(100% - 234rpx); |
||||
.title { |
||||
font-size: 28rpx; |
||||
color: #333; |
||||
font-size: 500; |
||||
line-height: 40rpx; |
||||
} |
||||
.time,.address{ |
||||
color: #999; |
||||
font-size: 24rpx; |
||||
margin-top: 5rpx; |
||||
line-height: 34rpx; |
||||
} |
||||
.intro { |
||||
font-size: 28rpx; |
||||
color: #999999; |
||||
line-height: 40rpx; |
||||
margin: 8rpx 0 36rpx; |
||||
} |
||||
.type-box { |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
margin-top: 28rpx; |
||||
.price{ |
||||
font-size: 36rpx; |
||||
color: #EA533E; |
||||
font-weight: 600; |
||||
} |
||||
.signin-btn{ |
||||
width: 156rpx; |
||||
height: 60rpx; |
||||
text-align: center; |
||||
line-height: 60rpx; |
||||
background: #FFEAE7; |
||||
border-radius: 12rpx; |
||||
font-size: 32rpx; |
||||
} |
||||
.red{ |
||||
background: #FFEAE7; |
||||
color: #EE7060; |
||||
} |
||||
.blue { |
||||
color: #6E85EB; |
||||
background: #ECEFFD; |
||||
} |
||||
.yellow { |
||||
color: #F99C10; |
||||
background: #FFEDCC; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,196 @@
|
||||
<template> |
||||
<view class="evaluate-con"> |
||||
<view class="goodsStyle acea-row row-between" v-if="orderCon.productInfo"> |
||||
<view class="pictrue"> |
||||
<image :src="orderCon.productInfo.image" class="image" /> |
||||
</view> |
||||
<view class="text acea-row row-between"> |
||||
<view class="name line2">{{ orderCon.productInfo.storeName }}</view> |
||||
<view class="money"> |
||||
<view>￥{{ orderCon.productInfo.price }}</view> |
||||
<view class="num">x{{ orderCon.cartNum }}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="score"> |
||||
<view class="item acea-row row-middle" v-for="(item, scoreListIndexw) in scoreList" :key="scoreListIndexw"> |
||||
<view>{{ item.name }}</view> |
||||
<view class="starsList"> |
||||
<text @click="stars(starsIndexn, scoreListIndexw)" v-for="(itemn, starsIndexn) in item.stars" |
||||
:key="starsIndexn" class="iconfont" |
||||
:class="item.index >= starsIndexn ? 'icon-shitixing font-color-red': 'icon-kongxinxing'"></text> |
||||
</view> |
||||
<text class="evaluate">{{item.index === -1 ? "" : item.index + 1 + "分"}}</text> |
||||
</view> |
||||
<view class="textarea"> |
||||
<textarea placeholder="商品满足你的期待么？说说你的想法，分享给想买的他们吧~" v-model="expect"></textarea> |
||||
<view class="list acea-row row-middle"> |
||||
<view class="pictrue" v-for="(item, uploadPicturesIndex) in uploadPictures" |
||||
:key="uploadPicturesIndex"> |
||||
<image :src="item" /> |
||||
<text class="iconfont icon-guanbi1 font-color-red" |
||||
@click="uploadPictures.splice(uploadPicturesIndex, 1)"></text> |
||||
</view> |
||||
<view class="pictrue uploadBnt acea-row row-center-wrapper row-column" @tap="chooseImage"> |
||||
<text class="iconfont icon-icon25201"></text> |
||||
<view>上传图片</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="evaluateBnt bg-color-red" @click="submit">立即评价</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
<style scoped lang="less"> |
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt { |
||||
border: 1px solid #ddd; |
||||
} |
||||
</style> |
||||
<script> |
||||
import { |
||||
postOrderProduct, |
||||
postOrderComment |
||||
} from "@/api/store"; |
||||
import { |
||||
trim, |
||||
chooseImage |
||||
} from "@/utils"; |
||||
import { |
||||
VUE_APP_API_URL |
||||
} from "@/config"; |
||||
import { |
||||
required |
||||
} from "@/utils/validate"; |
||||
import { |
||||
validatorDefaultCatch |
||||
} from "@/utils/dialog"; |
||||
|
||||
const NAME = "GoodsEvaluate"; |
||||
|
||||
export default { |
||||
name: NAME, |
||||
components: { |
||||
// VueCoreImageUpload |
||||
}, |
||||
props: {}, |
||||
data: function() { |
||||
return { |
||||
orderCon: { |
||||
cartProduct: { |
||||
productInfo: {} |
||||
} |
||||
}, |
||||
scoreList: [{ |
||||
name: "商品质量", |
||||
stars: ["", "", "", "", ""], |
||||
index: -1 |
||||
}, |
||||
{ |
||||
name: "服务态度", |
||||
stars: ["", "", "", "", ""], |
||||
index: -1 |
||||
} |
||||
], |
||||
uploadPictures: [], |
||||
expect: "", |
||||
unique: "" |
||||
}; |
||||
}, |
||||
mounted: function() { |
||||
this.unique = this.$yroute.query.id; |
||||
this.getOrderProduct(); |
||||
}, |
||||
watch: { |
||||
$yroute(n) { |
||||
if (n.name === NAME && this.unique !== n.params.id) { |
||||
this.unique = n.params.id; |
||||
this.$set(this.scoreList[0], "index", -1); |
||||
this.$set(this.scoreList[1], "index", -1); |
||||
this.expect = ""; |
||||
this.uploadPictures = []; |
||||
this.getOrderProduct(); |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
getOrderProduct: function() { |
||||
let that = this, |
||||
unique = that.unique; |
||||
postOrderProduct(unique).then(res => { |
||||
that.orderCon = res.data; |
||||
}); |
||||
}, |
||||
stars: function(indexn, indexw) { |
||||
this.scoreList[indexw].index = indexn; |
||||
}, |
||||
chooseImage() { |
||||
chooseImage(img => { |
||||
this.uploadPictures.push(img); |
||||
}); |
||||
}, |
||||
async submit() { |
||||
const expect = trim(this.expect), |
||||
product_score = |
||||
this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1, |
||||
service_score = |
||||
this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1; |
||||
try { |
||||
await this.$validator({ |
||||
product_score: [ |
||||
required("请选择商品质量分数", { |
||||
type: "number" |
||||
}) |
||||
], |
||||
service_score: [ |
||||
required("请选择服务态度分数", { |
||||
type: "number" |
||||
}) |
||||
] |
||||
}).validate({ |
||||
product_score, |
||||
service_score |
||||
}); |
||||
} catch (e) { |
||||
return validatorDefaultCatch(e); |
||||
} |
||||
postOrderComment({ |
||||
productScore: product_score, |
||||
serviceScore: service_score, |
||||
unique: this.unique, |
||||
pics: this.uploadPictures.join(","), |
||||
comment: expect |
||||
}) |
||||
.then(() => { |
||||
uni.showToast({ |
||||
title: "评价成功", |
||||
icon: "success", |
||||
duration: 2000 |
||||
}); |
||||
|
||||
// ? 回跳到上一页 |
||||
this.$yrouter.back(); |
||||
|
||||
// ? 默认跳转到详情页 |
||||
// this.$yrouter.push({ |
||||
// path: "/pages/order/OrderDetails/index", |
||||
// query: { |
||||
// id: this.orderCon.orderId |
||||
// } |
||||
// }); |
||||
|
||||
// ? 可选重定向到详情页，这时左上角会有一个返回首页的图标 |
||||
// this.$yrouter.reLaunch({ |
||||
// path: "/pages/home/index", |
||||
// }); |
||||
}) |
||||
.catch(err => { |
||||
uni.showToast({ |
||||
title: err.msg || err.response.data.msg || err.response.data.message, |
||||
icon: "none", |
||||
duration: 2000 |
||||
}); |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
@ -0,0 +1,65 @@
|
||||
<template> |
||||
<view class="register absolute"> |
||||
<view class="shading"> |
||||
<view class="pictrue acea-row row-center-wrapper"> |
||||
<image :src="`${$VUE_APP_RESOURCES_URL}/images/logo.png`" /> |
||||
</view> |
||||
</view> |
||||
<view class="whiteBg"> |
||||
<view class="title">注册账号</view> |
||||
<view class="list"> |
||||
<view class="item"> |
||||
<view> |
||||
<!-- <svg class="icon" aria-hidden="true"> |
||||
<use xlink:href="#icon-phone_" /> |
||||
</svg> --> |
||||
<input name="phone" type="text" placeholder="输入手机号码" /> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<view class="align-left"> |
||||
<!-- <svg class="icon" aria-hidden="true"> |
||||
<use xlink:href="#icon-code_1" /> |
||||
</svg> --> |
||||
<input name="" type="text" placeholder="填写验证码" class="codeIput" /> |
||||
<button class="verifyCode" :disabled="disabled" :class="disabled === true ? 'on' : ''" |
||||
@click="code">{{ text }}</button> |
||||
</view> |
||||
</view> |
||||
<view class="item"> |
||||
<view> |
||||
<!-- <svg class="icon" aria-hidden="true"> |
||||
<use xlink:href="#icon-code_" /> |
||||
</svg> --> |
||||
<input type="text" placeholder="填写您的登录密码" /> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="logon">注册</view> |
||||
<view class="tip"> |
||||
已有账号? |
||||
<text @click="goLogin()" class="font-color-red">立即登录</text> |
||||
</view> |
||||
</view> |
||||
<view class="bottom"></view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import sendVerifyCode from "@/mixins/SendVerifyCode"; |
||||
|
||||
export default { |
||||
name: "Register", |
||||
mixins: [sendVerifyCode], |
||||
methods: { |
||||
code: function () { |
||||
this.sendCode(); |
||||
}, |
||||
goLogin() { |
||||
this.$yrouter.push({ |
||||
path: "/pages/user/Login/index" |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
@ -0,0 +1,202 @@
|
||||
<template> |
||||
<view class="addAddress absolute"> |
||||
<view class="list"> |
||||
<view class="item acea-row row-between-wrapper"> |
||||
<view class="name">姓名</view> |
||||
<input type="text" placeholder="请输入姓名" v-model="userAddress.realName" required /> |
||||
</view> |
||||
<view class="item acea-row row-between-wrapper"> |
||||
<view class="name">联系电话</view> |
||||
<input type="text" placeholder="请输入联系电话" v-model="userAddress.phone" required /> |
||||
</view> |
||||
<view class="item acea-row row-between-wrapper"> |
||||
<view class="name">所在地区</view> |
||||
<view class="picker acea-row row-between-wrapper select-value form-control"> |
||||
<view class="address"> |
||||
<CitySelect ref="cityselect" :defaultValue="addressText" @callback="result" :items="district"></CitySelect> |
||||
</view> |
||||
<view class="iconfont icon-dizhi font-color-red"></view> |
||||
</view> |
||||
</view> |
||||
<view class="item acea-row row-between-wrapper"> |
||||
<view class="name">详细地址</view> |
||||
<input type="text" placeholder="请填写具体地址" v-model="userAddress.detail" required /> |
||||
</view> |
||||
</view> |
||||
<view class="default acea-row row-middle"> |
||||
<view class="select-btn"> |
||||
<view class="checkbox-wrapper"> |
||||
<checkbox-group @change="ChangeIsDefault"> |
||||
<label class="well-check"> |
||||
<checkbox :value="userAddress.isDefault==1?'checked':''" :checked="userAddress.isDefault ? true : false"></checkbox> |
||||
<text class="def">设置为默认地址</text> |
||||
</label> |
||||
</checkbox-group> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view></view> |
||||
<view class="keepBnt bg-color-red" @tap="submit">立即保存</view> |
||||
<view class="wechatAddress" v-if="isWechat && !id" @click="getAddress">导入微信地址</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script type="text/babel"> |
||||
import CitySelect from "@/components/CitySelect"; |
||||
import { getAddress, postAddress, getCity } from "@/api/user"; |
||||
import attrs, { required, chs_phone } from "@/utils/validate"; |
||||
import { validatorDefaultCatch } from "@/utils/dialog"; |
||||
// import { openAddress } from "@/libs/wechat"; |
||||
import { isWeixin } from "@/utils"; |
||||
|
||||
export default { |
||||
name: "AddAddress", |
||||
components: { |
||||
CitySelect |
||||
}, |
||||
data() { |
||||
return { |
||||
district: [], |
||||
id: 0, |
||||
userAddress: { isDefault: 0 }, |
||||
address: {}, |
||||
isWechat: isWeixin(), |
||||
addressText: "" |
||||
}; |
||||
}, |
||||
mounted: function() { |
||||
let id = this.$yroute.query.id; |
||||
this.id = id; |
||||
this.getUserAddress(); |
||||
this.getCityList(); |
||||
}, |
||||
watch: { |
||||
addressText(nextModel2) { |
||||
console.log(nextModel2, 8585858585); |
||||
} |
||||
}, |
||||
methods: { |
||||
getCityList: function() { |
||||
let that = this; |
||||
getCity() |
||||
.then(res => { |
||||
that.district = res.data; |
||||
that.ready = true; |
||||
}) |
||||
.catch(err => { |
||||
uni.showToast({ |
||||
title: err.msg, |
||||
icon: "none", |
||||
duration: 2000, |
||||
}); |
||||
}); |
||||
}, |
||||
getUserAddress: function() { |
||||
if (!this.id) return false; |
||||
let that = this; |
||||
getAddress(that.id).then(res => { |
||||
that.userAddress = res.data; |
||||
that.addressText = |
||||
res.data.province + " " + res.data.city + " " + res.data.district; |
||||
that.address.province = res.data.province; |
||||
that.address.city = res.data.city; |
||||
that.address.district = res.data.district; |
||||
}); |
||||
}, |
||||
getAddress() {}, |
||||
async submit() { |
||||
console.log(this); |
||||
console.log(this.address); |
||||
console.log(this.addressText); |
||||
let name = this.userAddress.realName, |
||||
phone = this.userAddress.phone, |
||||
addressText = this.addressText, |
||||
detail = this.userAddress.detail, |
||||
isDefault = this.userAddress.isDefault; |
||||
try { |
||||
await this.$validator({ |
||||
name: [ |
||||
required(required.message("姓名")), |
||||
attrs.range([2, 16], attrs.range.message("姓名")) |
||||
], |
||||
phone: [ |
||||
required(required.message("联系电话")), |
||||
chs_phone(chs_phone.message()) |
||||
], |
||||
addressText: [required("请选择地址")], |
||||
detail: [required(required.message("具体地址"))] |
||||
}).validate({ name, phone, addressText, detail }); |
||||
} catch (e) { |
||||
return validatorDefaultCatch(e); |
||||
} |
||||
try { |
||||
let that = this, |
||||
data = { |
||||
id: that.id, |
||||
real_name: name, |
||||
phone: phone, |
||||
address: this.address, |
||||
detail: detail, |
||||
is_default: isDefault ? true : false, |
||||
post_code: "" |
||||
}; |
||||
postAddress(data).then(function() { |
||||
if (that.id) { |
||||
uni.showToast({ |
||||
title: "修改成功", |
||||
icon: "none", |
||||
duration: 2000 |
||||
}); |
||||
} else { |
||||
uni.showToast({ |
||||
title: "操作成功", |
||||
icon: "none", |
||||
duration: 2000 |
||||
}); |
||||
// uni.showToast({ |
||||
// title: "已取消绑定", |
||||
// icon: "none", |
||||
// duration: 2000 |
||||
// }); |
||||
// that.$yrouter.replace({ |
||||
// path: "/pages/user/PersonalData/index" |
||||
// }); |
||||
} |
||||
that.$yrouter.back(); |
||||
}); |
||||
} catch (err) { |
||||
uni.showToast({ |
||||
title: err.msg || err.response.data.msg || err.response.data.message, |
||||
icon: "none", |
||||
duration: 2000 |
||||
}); |
||||
} |
||||
}, |
||||
ChangeIsDefault: function() { |
||||
this.userAddress.isDefault = !this.userAddress.isDefault; |
||||
}, |
||||
result(values) { |
||||
console.log(this); |
||||
console.log(values); |
||||
this.address = { |
||||
province: values.province.name || "", |
||||
city: values.city.name || "", |
||||
district: values.district.name || "", |
||||
city_id: values.city.id |
||||
}; |
||||
this.addressText = `${this.address.province}${this.address.city}${this.address.district}`; |
||||
// this.addressText = |
||||
// this.address.province + this.address.city + this.address.district; |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="less"> |
||||
.address { |
||||
text { |
||||
width: 100%; |
||||
display: block; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,223 @@
|
||||
<template> |
||||
<view |
||||
class="address-management" |
||||
:class="addressList.length < 1 && page > 1 ? 'on' : ''" |
||||
ref="container" |
||||
> |
||||
<view class="line" v-if="addressList.length > 0"> |
||||
<image :src="`${$VUE_APP_RESOURCES_URL}/images/line.jpg`" /> |
||||
</view> |
||||
<view class="item" v-for="(item, addressListIndex) in addressList" :key="addressListIndex"> |
||||
<view class="address"> |
||||
<view class="consignee"> |
||||
收货人：{{ item.realName }} |
||||
<text class="phone">{{ item.phone }}</text> |
||||
</view> |
||||
<view> |
||||
收货地址：{{ item.province }}{{ item.city }}{{ item.district |
||||
}}{{ item.detail }} |
||||
</view> |
||||
</view> |
||||
<view class="operation acea-row row-between-wrapper"> |
||||
<view class="select-btn"> |
||||
<view class="checkbox-wrapper"> |
||||
<checkbox-group @change="radioChange(item.id)"> |
||||
<label class="well-check"> |
||||
<checkbox :value="item.isDefault==1?'checked':''" :checked="item.isDefault||item.isDefault=='1' ? true : false"></checkbox> |
||||
<text class="default">设为默认</text> |
||||
</label> |
||||
</checkbox-group> |
||||
<!-- <label class="well-check"> |
||||
<input |
||||
type="radio" |
||||
name="default" |
||||
value |
||||
:checked="item.isDefault ? true : false" |
||||
@click="radioChange(addressListIndex)" |
||||
/> |
||||
<i class="icon"></i> |
||||
<text class="default">设为默认</text> |
||||
</label>--> |
||||
</view> |
||||
</view> |
||||
<view class="acea-row row-middle"> |
||||
<view @click="editAddress(addressListIndex)"> |
||||
<text class="iconfont icon-bianji"></text>编辑 |
||||
</view> |
||||
<view @click="delAddress(addressListIndex)"> |
||||
<text class="iconfont icon-shanchu"></text>删除 |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<Loading :loaded="loadend" :loading="loading"></Loading> |
||||
<view class="noCommodity" v-if="addressList.length < 1 && page > 1"> |
||||
<view class="noPictrue"> |
||||
<image :src="`${$VUE_APP_RESOURCES_URL}/images/noAddress.png`" class="image" /> |
||||
</view> |
||||
</view> |
||||
<view style="height:100rpx;"></view> |
||||
<view class="footer acea-row row-between-wrapper"> |
||||
<view class="addressBnt bg-color-red" v-if="isWechat" @click="addAddress"> |
||||
<text class="iconfont icon-tianjiadizhi"></text>添加新地址 |
||||
</view> |
||||
<view class="addressBnt on bg-color-red" v-else @click="addAddress"> |
||||
<text class="iconfont icon-tianjiadizhi"></text>添加新地址 |
||||
</view> |
||||
<!--<view class="addressBnt wxbnt" v-if="isWechat" @click="getAddress">--> |
||||
<!--<text class="iconfont icon-weixin2"></text>导入微信地址--> |
||||
<!--</view>--> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
<style scoped lang="less"> |
||||
.address-management.on { |
||||
background-color: #fff; |
||||
height: 100vh; |
||||
} |
||||
</style> |
||||
<script type="text/babel"> |
||||
import { |
||||
getAddressList, |
||||
getAddressRemove, |
||||
getAddressDefaultSet, |
||||
postAddress |
||||
} from "@/api/user"; |
||||
import Loading from "@/components/Loading"; |
||||
import { isWeixin } from "@/utils"; |
||||
// import { openAddress } from "@/libs/wechat"; |
||||
|
||||
export default { |
||||
components: { |
||||
Loading |
||||
}, |
||||
data() { |
||||
return { |
||||
page: 1, |
||||
limit: 20, |
||||
addressList: [], |
||||
loadTitle: "", |
||||
loading: false, |
||||
loadend: false, |
||||
isWechat: isWeixin() |
||||
}; |
||||
}, |
||||
mounted: function() { |
||||
this.AddressList(); |
||||
}, |
||||
onReachBottom() { |
||||
!this.loading && this.AddressList(); |
||||
}, |
||||
onShow: function() { |
||||
this.refresh(); |
||||
}, |
||||
methods: { |
||||
refresh: function() { |
||||
this.addressList = []; |
||||
this.page = 1; |
||||
this.loadend = false; |
||||
this.AddressList(); |
||||
}, |
||||
/** |
||||
* 获取地址列表 |
||||
* |
||||
*/ |
||||
AddressList: function() { |
||||
let that = this; |
||||
if (that.loading) return; //阻止下次请求（false可以进行请求）； |
||||
if (that.loadend) return; //阻止结束当前请求（false可以进行请求）； |
||||
that.loading = true; |
||||
getAddressList({ page: that.page, limit: that.limit }).then(res => { |
||||
that.loading = false; |
||||
//apply();js将一个数组插入另一个数组; |
||||
that.addressList.push.apply(that.addressList, res.data); |
||||
that.loadend = res.data.length < that.limit; //判断所有数据是否加载完成； |
||||
that.page = that.page + 1; |
||||
}); |
||||
}, |
||||
/** |
||||
* 编辑地址 |
||||
*/ |
||||
editAddress: function(index) { |
||||
this.$yrouter.push({ |
||||
path: "/pages/user/address/AddAddress/index", |
||||
query: { id: this.addressList[index].id } |
||||
}); |
||||
}, |
||||
/** |
||||
* 删除地址 |
||||
*/ |
||||
delAddress: function(index) { |
||||
let that = this; |
||||
let address = this.addressList[index]; |
||||
let id = address.id; |
||||
getAddressRemove(id).then(function() { |
||||
uni.showToast({ |
||||
title: "删除成功!", |
||||
icon:"success", |
||||
duration: 2000, |
||||
complete: () => { |
||||
that.addressList.splice(index, 1); |
||||
that.$set(that, "addressList", that.addressList); |
||||
} |
||||
}); |
||||
}); |
||||
}, |
||||
/** |
||||
* 设置默认地址 |
||||
*/ |
||||
radioChange: function(id) { |
||||
getAddressDefaultSet(id).then(res => { |
||||
this.refresh(); |
||||
uni.showToast({ title: res.msg, icon: "none", duration: 2000 }); |
||||
}); |
||||
}, |
||||
/** |
||||
* 新增地址 |
||||
*/ |
||||
addAddress: function() { |
||||
this.$yrouter.push({ |
||||
path: "/pages/user/address/AddAddress/index" |
||||
}); |
||||
}, |
||||
getAddress() { |
||||
// openAddress().then(userInfo => { |
||||
// uni.showLoading({ title: "加载中" }); |
||||
// postAddress({ |
||||
// real_name: userInfo.userName, |
||||
// phone: userInfo.telNumber, |
||||
// address: { |
||||
// province: userInfo.provinceName, |
||||
// city: userInfo.cityName, |
||||
// district: userInfo.countryName |
||||
// }, |
||||
// detail: userInfo.detailInfo, |
||||
// post_code: userInfo.postalCode, |
||||
// wx_export: 1 |
||||
// }) |
||||
// .then(() => { |
||||
// this.page = 1; |
||||
// this.loading = false; |
||||
// this.loadend = false; |
||||
// this.addressList = []; |
||||
// this.AddressList(); |
||||
// uni.hideLoading(); |
||||
// uni.showToast({ |
||||
// title: "添加成功", |
||||
// icon: 'success', |
||||
// duration: 2000 |
||||
// }); |
||||
// }) |
||||
// .catch(err => { |
||||
// uni.hideLoading(); |
||||
// uni.showToast({ |
||||
// title: err.msg || err.response.data.msg|| err.response.data.message, |
||||
// icon: 'none', |
||||
// duration: 2000 |
||||
// }); |
||||
// }); |
||||
// }); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
Before Width: | Height: | Size: 344 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 511 B |
|
After Width: | Height: | Size: 825 B |
|
After Width: | Height: | Size: 562 B |
|
After Width: | Height: | Size: 642 B |
|
After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 336 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 407 B |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 897 B |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue