102 changed files with 3682 additions and 722 deletions
@ -1,225 +1,306 @@ |
|||||||
<template> |
<template> |
||||||
<view class="konwledge-index index"> |
<view class="konwledge-index index"> |
||||||
<view class="header header-search acea-row row-center-wrapper"> |
<view class="header header-search acea-row row-center-wrapper"> |
||||||
<view @click="goGoodSearch()" class="search acea-row row-middle"> |
<view @click="goGoodSearch()" class="search acea-row row-middle"> |
||||||
<text class="iconfont icon-xiazai5"></text> |
<text class="iconfont icon-xiazai5"></text> |
||||||
搜索商品 |
搜索商品 |
||||||
|
</view> |
||||||
|
<!-- #ifndef H5 --> |
||||||
|
<view class="qr" @click="startQr()" v-if="$deviceType !== 'weixin'"> |
||||||
|
<image :src="`${$VUE_APP_RESOURCES_URL}/images/qr.png`" /> |
||||||
|
</view> |
||||||
|
<!-- #endif --> |
||||||
|
</view> |
||||||
|
<view class="content-box"> |
||||||
|
<view class="tab-box"> |
||||||
|
<wuc-tab :tab-list="tabList" :tabCur.sync="TabCur" @change="tabChange" |
||||||
|
tab-class="text-center text-black bg-white" select-class="text-orange text-xl"> |
||||||
|
</wuc-tab> |
||||||
|
<SecondMenu :menuList="secondMenu" :active.sync="active" @secondMenuClick="secondMenuClick"> |
||||||
|
</SecondMenu> |
||||||
|
</view> |
||||||
|
<view class="bangdan-box"> |
||||||
|
<view class="bangdan-list"> |
||||||
|
<scroll-view class="scroll-view_H" scroll-x="true"> |
||||||
|
<view class="bangdan-item" |
||||||
|
:class="index%2 !== 0 ? 'bgR' : ''" |
||||||
|
v-for="(item,index) in 6" :key="index" |
||||||
|
@click="toStudyDetail(item.id)"> |
||||||
|
<view>连续11天打卡站桩</view> |
||||||
|
<view class="time">2021.5.28-2021.6.18</view> |
||||||
|
<view class="acea-row row-between-wrapper"> |
||||||
|
<view class="jifen">30积分</view> |
||||||
|
<view class="signin-btn">报名参加</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</scroll-view> |
||||||
</view> |
</view> |
||||||
<!-- #ifndef H5 --> |
</view> |
||||||
<view class="qr" @click="startQr()" v-if="$deviceType !== 'weixin'"> |
<view class="knowledge-list"> |
||||||
<image :src="`${$VUE_APP_RESOURCES_URL}/images/qr.png`" /> |
<view class="active-word">国学·琴</view> |
||||||
|
<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" @click="toDetail(1)">去报名</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
<!-- #endif --> |
|
||||||
</view> |
</view> |
||||||
<view class="content-box"> |
|
||||||
<wuc-tab |
|
||||||
:tab-list="tabList" |
|
||||||
:tabCur.sync="TabCur" |
|
||||||
@change="tabChange" |
|
||||||
tab-class="text-center text-black bg-white" select-class="text-orange text-xl"> |
|
||||||
</wuc-tab> |
|
||||||
<SecondMenu |
|
||||||
:menuList="secondMenu" |
|
||||||
:active.sync="active" |
|
||||||
@secondMenuClick="secondMenuClick"> |
|
||||||
</SecondMenu> |
|
||||||
<view class="knowledge-list"> |
|
||||||
<view class="knowledge-item acea-row" v-for="item in articleList" @click="toDetail(item.id)"> |
|
||||||
<view class="img-box"> |
|
||||||
<image :src="item.imageInput" mode=""></image> |
|
||||||
</view> |
|
||||||
<view class="knowledge-info-box"> |
|
||||||
<view class="title line1">{{item.title}}</view> |
|
||||||
<view class="intro line2">{{item.synopsis}}</view> |
|
||||||
<view class="type-box acea-row"> |
|
||||||
<view class="tip blue">{{item.chargeType == 0 ? '免费' : item.articleCharge}}</view> |
|
||||||
<view class="time">{{item.addTime}}</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
</view> |
||||||
|
</view> |
||||||
</template> |
</template> |
||||||
|
<script module="utils" lang="wxs" src="../../utils/subutil.wxs"></script> |
||||||
<script> |
<script> |
||||||
import WucTab from '@/components/wuc-tab/wuc-tab.vue'; |
import WucTab from '@/components/wuc-tab/wuc-tab.vue'; |
||||||
import SecondMenu from '../knowledge/components/secondMenu.vue'; |
import SecondMenu from '../knowledge/components/secondMenu.vue'; |
||||||
import { getCategory,getArticle } from '@/api/knowledge'; |
import { |
||||||
|
getCategory, |
||||||
|
getArticle, |
||||||
|
getStudyList, |
||||||
|
getCourses |
||||||
|
} from '@/api/knowledge'; |
||||||
export default { |
export default { |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
TabCur: null, |
TabCur: null, |
||||||
tabList: [{categoryName:'七雅',id:10},{categoryName:'武当',id:12},], |
tabList: [], |
||||||
secondMenu:[], |
secondMenu: [], |
||||||
active:null, |
active: null, |
||||||
articleList:[] |
courseList: [], |
||||||
|
studyList:[] |
||||||
} |
} |
||||||
}, |
}, |
||||||
components: { WucTab,SecondMenu }, |
components: { |
||||||
|
WucTab, |
||||||
|
SecondMenu |
||||||
|
}, |
||||||
onLoad() { |
onLoad() { |
||||||
return false |
getCategory().then((res) => { |
||||||
getCategory().then((res)=>{ |
|
||||||
this.tabList = res.data |
this.tabList = res.data |
||||||
this.$set(this, 'tabList', res.data) |
this.$set(this, 'tabList', res.data) |
||||||
this.$set(this, 'secondMenu', res.data[0].categoryList) |
this.$set(this, 'secondMenu', res.data[0].categoryList) |
||||||
this.$set(this, 'TabCur', res.data[0].id) |
this.$set(this, 'TabCur', res.data[0].id) |
||||||
if(res.data[0].categoryList.length > 0){ |
if (res.data[0].categoryList.length > 0) { |
||||||
this.$set(this, 'active', res.data[0].categoryList[0].id) |
this.$set(this, 'active', res.data[0].categoryList[0].id) |
||||||
} |
} |
||||||
}).then(()=>{ |
}).then(() => { |
||||||
this.getArticle() |
this.getStudyList() |
||||||
|
this.getCourses() |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
methods: { |
methods: { |
||||||
toDetail(id){ |
toStudyDetail(id) { |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/study/detail', |
||||||
|
query: { |
||||||
|
id: id, |
||||||
|
}, |
||||||
|
}) |
||||||
|
}, |
||||||
|
toDetail(id) { |
||||||
this.$yrouter.push({ |
this.$yrouter.push({ |
||||||
path: '/pages/knowledge/detail', |
path: '/pages/course/detail', |
||||||
query: { |
query: { |
||||||
id: id, |
id: id, |
||||||
}, |
}, |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
getArticle(){ |
getStudyList() { |
||||||
var cid = null; |
var cid = null; |
||||||
this.active == null ? cid = this.TabCur : cid = this.active |
this.active == null ? cid = this.TabCur : cid = this.active |
||||||
getArticle({cid:cid}).then((res)=>{ |
getStudyList({categoryId: cid,listState:0}).then((res) => { |
||||||
if(res.success){ |
if (res.success) { |
||||||
this.articleList = res.data |
this.studyList = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
getCourses() { |
||||||
|
var cid = null; |
||||||
|
this.active == null ? cid = this.TabCur : cid = this.active |
||||||
|
getCourses({categoryId: cid,listState:0}).then((res) => { |
||||||
|
if (res.success) { |
||||||
|
this.courseList = res.data |
||||||
} |
} |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
tabChange(item) { |
tabChange(item) { |
||||||
if(item.categoryList.length > 0){ |
if (item.categoryList.length > 0) { |
||||||
this.$set(this, 'active', item.categoryList[0].id) |
this.$set(this, 'active', item.categoryList[0].id) |
||||||
} |
} |
||||||
this.secondMenu = item.categoryList; |
this.secondMenu = item.categoryList; |
||||||
this.TabCur = item.id; |
this.TabCur = item.id; |
||||||
this.getArticle() |
this.getStudyList() |
||||||
|
this.getCourses() |
||||||
}, |
}, |
||||||
secondMenuClick(item){ |
secondMenuClick(item) { |
||||||
this.active = item.id; |
this.active = item.id; |
||||||
this.getArticle() |
this.getStudyList() |
||||||
|
this.getCourses() |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style scoped lang="less"> |
<style scoped lang="less"> |
||||||
|
|
||||||
.header-search { |
.header-search { |
||||||
transition: all linear 0.3s; |
transition: all linear 0.3s; |
||||||
background: #fff; |
background: #fff; |
||||||
.search{ |
.search { |
||||||
border: 2rpx solid #EA533E; |
border: 2rpx solid #EA533E; |
||||||
background-color: #fff; |
background-color: #fff; |
||||||
} |
} |
||||||
} |
} |
||||||
.konwledge-index{ |
.content-box{ |
||||||
background: #fff; |
width: 100%; |
||||||
min-height: 100%; |
box-sizing: border-box; |
||||||
.content-box{ |
.tab-box{ |
||||||
width: 100%; |
box-shadow: 0px 6px 12px 0px rgba(227,227,227,0.29); |
||||||
box-sizing: border-box; |
} |
||||||
padding: 0 24rpx; |
/deep/.second-menu-box{ |
||||||
|
padding: 30rpx 32rpx; |
||||||
} |
} |
||||||
.introduce-box{ |
} |
||||||
|
.bangdan-box{ |
||||||
|
width: 100%; |
||||||
|
box-sizing: border-box; |
||||||
|
padding-left: 30rpx; |
||||||
|
.scroll-view_H{ |
||||||
|
white-space: nowrap; |
||||||
width: 100%; |
width: 100%; |
||||||
height: 328rpx; |
} |
||||||
box-shadow: 0px 6rpx 14rpx 8rpx rgba(255,234,231,0.2); |
.bangdan-item{ |
||||||
border-radius: 8px; |
width: 514rpx; |
||||||
overflow: hidden; |
height: 234rpx; |
||||||
margin: 30rpx 0; |
box-sizing: border-box; |
||||||
.left-box{ |
padding: 20rpx; |
||||||
width: 16rpx; |
color: #fff; |
||||||
height: 100%; |
display: inline-block; |
||||||
background: #FAEFED; |
background: linear-gradient(165deg, #3ABFB8 0%, #7CE1DD 100%); |
||||||
|
border-radius: 10rpx; |
||||||
|
font-size: 34rpx; |
||||||
|
margin-right: 20rpx; |
||||||
|
.time{ |
||||||
|
font-size: 24rpx; |
||||||
|
color: #FFFFFF; |
||||||
|
line-height: 40rpx; |
||||||
|
margin:10rpx 0 18rpx; |
||||||
|
|
||||||
} |
} |
||||||
.right-box{ |
.jifen{ |
||||||
width: calc(100% - 16rpx); |
font-size: 46rpx; |
||||||
padding: 30rpx 50rpx 0 24rpx; |
font-weight: 500; |
||||||
|
} |
||||||
|
.signin-btn{ |
||||||
|
width: 180rpx; |
||||||
|
height: 68rpx; |
||||||
|
background: #FFFFFF; |
||||||
|
border-radius: 40rpx; |
||||||
|
text-align: center; |
||||||
|
line-height: 68rpx; |
||||||
|
color: #222222; |
||||||
font-size: 26rpx; |
font-size: 26rpx; |
||||||
color: #999; |
|
||||||
.title-txt{ |
|
||||||
font-size: 36rpx; |
|
||||||
font-weight: 500; |
|
||||||
color: #3C464F; |
|
||||||
line-height: 50rpx; |
|
||||||
font-weight: 600; |
|
||||||
margin-bottom: 20rpx; |
|
||||||
} |
|
||||||
.desc{ |
|
||||||
text-indent: 1em; |
|
||||||
} |
|
||||||
} |
} |
||||||
} |
} |
||||||
|
.bgR{ |
||||||
.knowledge-list{ |
background: linear-gradient(165deg, #FF7563 0%, #FEABA0 100%); |
||||||
|
} |
||||||
|
} |
||||||
|
.konwledge-index { |
||||||
|
min-height: 100%; |
||||||
|
width: 100%; |
||||||
|
background: #fff; |
||||||
|
.knowledge-list { |
||||||
width: 100%; |
width: 100%; |
||||||
.knowledge-item{ |
padding:0 32rpx; |
||||||
|
margin-top: 50rpx; |
||||||
|
.knowledge-item { |
||||||
|
background: #fff; |
||||||
|
padding: 32rpx 0; |
||||||
border-bottom: 1px solid #ECECEC; |
border-bottom: 1px solid #ECECEC; |
||||||
padding-bottom: 20rpx; |
.img-box { |
||||||
margin-bottom: 20rpx; |
|
||||||
.img-box{ |
|
||||||
width: 204rpx; |
width: 204rpx; |
||||||
height: 200rpx; |
height: 200rpx; |
||||||
margin-right: 30rpx; |
margin-right: 30rpx; |
||||||
image{ |
image { |
||||||
width: 100%; |
width: 100%; |
||||||
height: 100%; |
height: 100%; |
||||||
} |
} |
||||||
} |
} |
||||||
.knowledge-info-box{ |
.knowledge-info-box { |
||||||
width: calc(100% - 234rpx); |
width: calc(100% - 234rpx); |
||||||
.title{ |
.title { |
||||||
font-size: 28rpx; |
font-size: 28rpx; |
||||||
color: #333; |
color: #333; |
||||||
font-size: 500; |
font-size: 500; |
||||||
line-height: 40rpx; |
line-height: 40rpx; |
||||||
} |
} |
||||||
.intro{ |
.time,.address{ |
||||||
|
color: #999; |
||||||
|
font-size: 24rpx; |
||||||
|
margin-top: 5rpx; |
||||||
|
line-height: 34rpx; |
||||||
|
} |
||||||
|
.intro { |
||||||
font-size: 28rpx; |
font-size: 28rpx; |
||||||
color: #999999; |
color: #999999; |
||||||
line-height: 40rpx; |
line-height: 40rpx; |
||||||
margin: 8rpx 0 36rpx; |
margin: 8rpx 0 36rpx; |
||||||
} |
} |
||||||
.type-box{ |
.type-box { |
||||||
font-size: 24rpx; |
font-size: 24rpx; |
||||||
color: #999; |
color: #999; |
||||||
.tip{ |
margin-top: 28rpx; |
||||||
width: 60rpx; |
.price{ |
||||||
height: 34rpx; |
font-size: 36rpx; |
||||||
line-height: 32rpx; |
color: #EA533E; |
||||||
|
font-weight: 600; |
||||||
|
} |
||||||
|
.signin-btn{ |
||||||
|
width: 156rpx; |
||||||
|
height: 60rpx; |
||||||
text-align: center; |
text-align: center; |
||||||
background: #EDEFF8; |
line-height: 60rpx; |
||||||
border-radius: 4rpx; |
background: #FFEAE7; |
||||||
border: 1px solid #6E85EB; |
border-radius: 12rpx; |
||||||
padding: 0 6rpx; |
font-size: 32rpx; |
||||||
font-size: 22rpx; |
} |
||||||
margin-right: 20rpx; |
.red{ |
||||||
box-sizing: border-box; |
background: #FFEAE7; |
||||||
|
color: #EE7060; |
||||||
} |
} |
||||||
.blue{ |
.blue { |
||||||
color: #6E85EB; |
color: #6E85EB; |
||||||
background: #EDEFF8; |
background: #ECEFFD; |
||||||
border-color: #6E85EB; |
|
||||||
} |
} |
||||||
.yellow{ |
.yellow { |
||||||
color: #F99C10; |
color: #F99C10; |
||||||
background: #FFEDCC; |
background: #FFEDCC; |
||||||
border-color: #F99C10; |
|
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
.text-black{ |
|
||||||
font-size: 32rpx; |
|
||||||
} |
|
||||||
.text-orange{ |
|
||||||
color: #EB5744; |
|
||||||
font-size: 40rpx !important; |
|
||||||
border-color: #EB5744; |
|
||||||
} |
|
||||||
|
|
||||||
</style> |
</style> |
||||||
|
|||||||
@ -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