对接新增地址、编辑地址、删除地址、获取地址、对接视频号
parent
3cf634a80b
commit
25de1f1a97
|
@ -0,0 +1,107 @@
|
||||||
|
.lotus-address-picker {
|
||||||
|
font-size: 26rpx;
|
||||||
|
padding-top: 30rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
line-height: normal;
|
||||||
|
padding-right: 30rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.lotus-address-picker-box {
|
||||||
|
/*display: -webkit-box;
|
||||||
|
display: -webkit-flex;*/
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
padding-top: 10rpx;
|
||||||
|
padding-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
.lotus-address-picker-box-item {
|
||||||
|
height: 600upx;
|
||||||
|
overflow-y: auto;
|
||||||
|
width: 33.333%;
|
||||||
|
padding-left: 20rpx;
|
||||||
|
padding-right: 20rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.lotus-address-picker2 {
|
||||||
|
color: #03affb;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.lotus-address-picker2:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 65%;
|
||||||
|
transform: translateY(-35%) rotate(-45deg);
|
||||||
|
width: 20rpx;
|
||||||
|
height: 10rpx;
|
||||||
|
border-left-width: 4rpx;
|
||||||
|
border-bottom-width: 4rpx;
|
||||||
|
border-left-style: solid;
|
||||||
|
border-bottom-style: solid;
|
||||||
|
border-left-color: #03affb;
|
||||||
|
border-bottom-color: #03affb;
|
||||||
|
}
|
||||||
|
.lotus-address-mask {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.lotus-address-box {
|
||||||
|
background: #fff;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
.lotus-address-action {
|
||||||
|
font-size: 30rpx;
|
||||||
|
/*display: -webkit-box;
|
||||||
|
display: -webkit-flex;*/
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 25rpx 30rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.lotus-address-action:after {
|
||||||
|
content: " ";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 1px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
color: #eee;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
transform: scaleY(0.5);
|
||||||
|
}
|
||||||
|
.lotus-address-action:before {
|
||||||
|
content: " ";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 1px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
color: #eee;
|
||||||
|
transform-origin: 0 100%;
|
||||||
|
transform: scaleY(0.5);
|
||||||
|
}
|
||||||
|
.lotus-address-action-cancel {
|
||||||
|
color: #969696;
|
||||||
|
}
|
||||||
|
.lotus-address-action-affirm {
|
||||||
|
color: #03affb;
|
||||||
|
}
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,233 @@
|
||||||
|
<template>
|
||||||
|
<!--地址picker-->
|
||||||
|
<view :status="checkStatus" v-if="lotusAddressData.visible" class="lotus-address-mask">
|
||||||
|
<view :class="lotusAddressData.visible?'lotus-address-box':'lotus-address-box lotus-address-box-out'">
|
||||||
|
<view class="lotus-address-action">
|
||||||
|
<text @tap="cancelPicker" class="lotus-address-action-cancel">取消</text>
|
||||||
|
<text @tap="chosedVal" class="lotus-address-action-affirm">确认</text>
|
||||||
|
</view>
|
||||||
|
<view class="lotus-address-picker-box">
|
||||||
|
<!--省-->
|
||||||
|
<scroll-view scroll-y :scroll-into-view="'pid'+pChoseIndex" class="lotus-address-picker-box-item">
|
||||||
|
<view @tap="clickPicker(0,pIndex,pItem);" :id="'pid'+pIndex" :class="pIndex === pChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(pItem,pIndex) in province" :key="pIndex">{{pItem}}</view>
|
||||||
|
</scroll-view>
|
||||||
|
<!--市-->
|
||||||
|
<scroll-view scroll-y :scroll-into-view="'cid'+cChoseIndex" class="lotus-address-picker-box-item">
|
||||||
|
<view @tap="clickPicker(1,cIndex,cItem);" :id="'cid'+cIndex" :class="cIndex === cChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(cItem,cIndex) in city" :key="cIndex">{{cItem}}</view>
|
||||||
|
</scroll-view>
|
||||||
|
<!--区-->
|
||||||
|
<scroll-view scroll-y :scroll-into-view="'tid'+tChoseIndex" class="lotus-address-picker-box-item">
|
||||||
|
<view @tap="clickPicker(2,tIndex,tItem);" :id="'tid'+tIndex" :class="tIndex === tChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(tItem,tIndex) in town" :key="tIndex">{{tItem}}</view>
|
||||||
|
</scroll-view>
|
||||||
|
<!--区END-->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--地址picker END-->
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {lotusAddressJson} from "./address-one.js";
|
||||||
|
export default {
|
||||||
|
props:['lotusAddressData'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
visible: false,
|
||||||
|
province:[],
|
||||||
|
city:[],
|
||||||
|
town:[],
|
||||||
|
provinceName:'',
|
||||||
|
cityName:'',
|
||||||
|
townName:'',
|
||||||
|
type:0,//0新增1编辑
|
||||||
|
pChoseIndex:-1,
|
||||||
|
cChoseIndex:-1,
|
||||||
|
tChoseIndex:-1
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
//取消
|
||||||
|
cancelPicker(){
|
||||||
|
const provinceCode = this.getTarId(this.provinceName);
|
||||||
|
const cityCode = this.getTarId(this.cityName);
|
||||||
|
const townCode = this.getTarId(this.townName);
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("choseVal",{
|
||||||
|
province:this.provinceName,
|
||||||
|
provinceCode,
|
||||||
|
city:this.cityName,
|
||||||
|
cityCode,
|
||||||
|
town:this.townName,
|
||||||
|
townCode,
|
||||||
|
isChose:0,
|
||||||
|
visible:false
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//获取最后选择的省市区的值
|
||||||
|
chosedVal() {
|
||||||
|
this.type = 1;
|
||||||
|
const provinceCode = this.getTarId(this.provinceName);
|
||||||
|
const cityCode = this.getTarId(this.cityName);
|
||||||
|
const townCode = this.getTarId(this.townName);
|
||||||
|
this.visible = false;
|
||||||
|
let isChose = 0;
|
||||||
|
//已选省市区 isChose = 1
|
||||||
|
if((this.provinceName&&this.cityName)||(this.provinceName&&this.cityName&&this.townName)){
|
||||||
|
isChose = 1;
|
||||||
|
}
|
||||||
|
this.$emit("choseVal",{
|
||||||
|
province:this.provinceName,
|
||||||
|
provinceCode,
|
||||||
|
city:this.cityName,
|
||||||
|
cityCode,
|
||||||
|
town:this.townName,
|
||||||
|
townCode,
|
||||||
|
isChose,
|
||||||
|
visible:false
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//获取省市区value
|
||||||
|
getTarId(name,type){
|
||||||
|
let id = 0;
|
||||||
|
lotusAddressJson.map((item,index)=>{
|
||||||
|
if(item.name === name){
|
||||||
|
id = item.value;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return id;
|
||||||
|
},
|
||||||
|
//获取市数据
|
||||||
|
getCityArr(parentId){
|
||||||
|
let city = [];
|
||||||
|
lotusAddressJson.map((item,index)=>{
|
||||||
|
if(item.parent === parentId){
|
||||||
|
city.push(item.name);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return city;
|
||||||
|
},
|
||||||
|
//获取区数据
|
||||||
|
getTownArr(parentId){
|
||||||
|
let town = [];
|
||||||
|
lotusAddressJson.map((item,index)=>{
|
||||||
|
if(index>34&&item.parent === parentId){
|
||||||
|
town.push(item.name);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return town;
|
||||||
|
},
|
||||||
|
//初始化数据
|
||||||
|
initFn(){
|
||||||
|
if(!this.province.length){
|
||||||
|
lotusAddressJson.map((item,index)=>{
|
||||||
|
if(index<=34){
|
||||||
|
this.province.push(item.name);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//已选择省市区,高亮显示对应选择省市区
|
||||||
|
const p = this._props.lotusAddressData.provinceName;
|
||||||
|
const c = this._props.lotusAddressData.cityName;
|
||||||
|
const t = this._props.lotusAddressData.townName;
|
||||||
|
//已选省
|
||||||
|
if(p){
|
||||||
|
this.pChoseIndex = this.getTarIndex(this.province,p);
|
||||||
|
}
|
||||||
|
//已选市
|
||||||
|
if(p&&c){
|
||||||
|
const pid = this.getTarId(p);
|
||||||
|
this.city = this.getCityArr(pid);
|
||||||
|
this.cChoseIndex = this.getTarIndex(this.city,c);
|
||||||
|
}
|
||||||
|
//已选区
|
||||||
|
if(p&&c&&t){
|
||||||
|
const cid= this.getTarId(c);
|
||||||
|
this.town = this.getTownArr(cid);
|
||||||
|
this.tChoseIndex = this.getTarIndex(this.town,t);
|
||||||
|
}
|
||||||
|
//未选省市区
|
||||||
|
if(!p&&!c&&!t){
|
||||||
|
this.pChoseIndex = -1;
|
||||||
|
this.cChoseIndex = -1;
|
||||||
|
this.tChoseIndex = -1;
|
||||||
|
this.city = [];
|
||||||
|
this.town = [];
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//获取已选省市区
|
||||||
|
getChosedData(){
|
||||||
|
const pid = this.getTarId(this.provinceName,'province');
|
||||||
|
this.city = this.getCityArr(pid);
|
||||||
|
const cid= this.getTarId(this.cityName,'city');
|
||||||
|
this.town = this.getTownArr(cid);
|
||||||
|
//已选省市区获取对应index
|
||||||
|
if(this.provinceName){
|
||||||
|
this.pChoseIndex = this.getTarIndex(this.province,this.provinceName);
|
||||||
|
}
|
||||||
|
if(this.cityName){
|
||||||
|
this.cChoseIndex = this.getTarIndex(this.city,this.cityName);
|
||||||
|
}
|
||||||
|
if(this.townName){
|
||||||
|
this.tChoseIndex = this.getTarIndex(this.town,this.townName);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//选择省市区交互
|
||||||
|
clickPicker(type,index,name){
|
||||||
|
//省
|
||||||
|
if(type === 0){
|
||||||
|
this.pChoseIndex = index;
|
||||||
|
this.provinceName = name;
|
||||||
|
this.cChoseIndex = -1;
|
||||||
|
this.tChoseIndex = -1;
|
||||||
|
this.cityName = '';
|
||||||
|
this.townName = '';
|
||||||
|
}
|
||||||
|
//市
|
||||||
|
if(type ===1){
|
||||||
|
this.cChoseIndex = index;
|
||||||
|
this.cityName = name;
|
||||||
|
this.tChoseIndex = -1;
|
||||||
|
this.townName = '';
|
||||||
|
}
|
||||||
|
//区
|
||||||
|
if(type === 2){
|
||||||
|
this.tChoseIndex = index;
|
||||||
|
this.townName = name;
|
||||||
|
}
|
||||||
|
//获取省市区数据
|
||||||
|
this.getChosedData();
|
||||||
|
},
|
||||||
|
//获取已选省市区index
|
||||||
|
getTarIndex(arr,tarName){
|
||||||
|
let cIndex = 0;
|
||||||
|
arr.map((item,index)=>{
|
||||||
|
if(item === tarName){
|
||||||
|
cIndex = index;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return cIndex;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
checkStatus(){
|
||||||
|
let t = null;
|
||||||
|
const _this = this;
|
||||||
|
if(!_this.visible){
|
||||||
|
_this.visible = _this._props.lotusAddressData.visible;
|
||||||
|
//获取省市区
|
||||||
|
_this.provinceName = _this._props.lotusAddressData.provinceName;
|
||||||
|
_this.cityName = _this._props.lotusAddressData.cityName;
|
||||||
|
_this.townName = _this._props.lotusAddressData.townName;
|
||||||
|
//生成初始化数据
|
||||||
|
_this.initFn();
|
||||||
|
t = _this.visible;
|
||||||
|
}
|
||||||
|
return t;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
@import "./address-one.css";
|
||||||
|
</style>
|
|
@ -87,6 +87,7 @@
|
||||||
console.log(res,'用户信息')
|
console.log(res,'用户信息')
|
||||||
if(res.code==0) {
|
if(res.code==0) {
|
||||||
this.userInfo = res.data;
|
this.userInfo = res.data;
|
||||||
|
uni.setStorageSync('userInfo',this.userInfo);
|
||||||
}
|
}
|
||||||
uni.hideLoading();
|
uni.hideLoading();
|
||||||
this.isLoading = true;
|
this.isLoading = true;
|
||||||
|
|
|
@ -179,10 +179,24 @@
|
||||||
},
|
},
|
||||||
// 播放视频
|
// 播放视频
|
||||||
palyVideo(index){
|
palyVideo(index){
|
||||||
uni.setStorageSync('videoList',this.videoList);
|
if(!this.videoList[index].src){
|
||||||
uni.navigateTo({
|
// #ifdef MP-WEIXIN
|
||||||
url:`/pagesB/play-video/play-video?current=${index}`
|
wx.openChannelsActivity({
|
||||||
})
|
finderUserName:this.videoList[index].video_number,
|
||||||
|
feedId:this.videoList[index].subtitle,
|
||||||
|
success:(res)=>{},fail:()=>{
|
||||||
|
this.$toolAll.tools.showToast('视频已丢失或已删除')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// #endif
|
||||||
|
} else {
|
||||||
|
let newArr = [];
|
||||||
|
newArr.push(this.videoList[index])
|
||||||
|
uni.setStorageSync('videoList',newArr);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pagesB/play-video/play-video?current=${index}`
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 更多
|
// 更多
|
||||||
goMore(index){
|
goMore(index){
|
||||||
|
|
|
@ -90,10 +90,24 @@
|
||||||
},
|
},
|
||||||
// 播放视频
|
// 播放视频
|
||||||
palyVideo(index){
|
palyVideo(index){
|
||||||
uni.setStorageSync('videoList',this.dataList);
|
if(!this.dataList[index].src){
|
||||||
uni.navigateTo({
|
// #ifdef MP-WEIXIN
|
||||||
url:`/pagesB/play-video/play-video?current=${index}`
|
wx.openChannelsActivity({
|
||||||
})
|
finderUserName:this.dataList[index].video_number,
|
||||||
|
feedId:this.dataList[index].subtitle,
|
||||||
|
success:(res)=>{},fail:()=>{
|
||||||
|
this.$toolAll.tools.showToast('视频已丢失或已删除')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// #endif
|
||||||
|
} else {
|
||||||
|
let newArr = [];
|
||||||
|
newArr.push(this.dataList[index])
|
||||||
|
uni.setStorageSync('videoList',newArr);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pagesB/play-video/play-video?current=${index}`
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,17 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<status-container titlet="我的地址" returnc="#FFFFFF">
|
<status-container titlet="我的地址" returnc="#FFFFFF">
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view slot="content" style="margin-top: -20rpx;" v-if="loading">
|
||||||
<view class="bacf pad-x30 pad-zy20" v-for="(item,index) in 10" :key="index">
|
<view @tap="chooseAddress(item)" class="bacf pad-x30 pad-zy20" v-for="(item,index) in addressList" :key="index">
|
||||||
<view class="pad-sx30 pad-zy20 disjbac bbot">
|
<view class="pad-sx30 pad-zy20 disjbac bbot">
|
||||||
<view class="fon22 col26">
|
<view class="fon22 col26">
|
||||||
<view class="" style="color: #676767;">四川省成都市武侯区</view>
|
<view class="" style="color: #676767;">{{item.province_str}}{{item.city_str}}{{item.county_str}}</view>
|
||||||
<view class="mar-sx10">成华奥园广场三期6栋1418-1419</view>
|
<view class="mar-sx10">{{item.address}}</view>
|
||||||
<view class="">郑珊珊 182****1234</view>
|
<view class="">{{item.name}} {{$toolAll.tools.hideMPhone(item.phone)}}</view>
|
||||||
</view>
|
</view>
|
||||||
<image class="flexs" @tap="$toolAll.tools.goPage(`/pagesB/add-address/add-address?id=${index}`)" src="/static/tabbar/icon-edit.png" mode="aspectFill" style="width: 32rpx;height: 34rpx;"></image>
|
<image class="flexs" @tap.stop="$toolAll.tools.goPage(`/pagesB/add-address/add-address?id=${item.id}`)" src="/static/tabbar/icon-edit.png" mode="aspectFill" style="width: 32rpx;height: 34rpx;"></image>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="" v-if="!addressList.length">
|
||||||
|
<nothingPage content="地址列表空荡荡滴"></nothingPage>
|
||||||
|
</view>
|
||||||
<view class="disjcac pad-s50">
|
<view class="disjcac pad-s50">
|
||||||
<view @tap="$toolAll.tools.goPage('/pagesB/add-address/add-address')" class="disjcac radius34" style="width: 396rpx;height: 72rpx;background-color: #f37717;color: #FFFFFF;">
|
<view @tap="$toolAll.tools.goPage('/pagesB/add-address/add-address')" class="disjcac radius34" style="width: 396rpx;height: 72rpx;background-color: #f37717;color: #FFFFFF;">
|
||||||
<view class="icon icon-add04 fon28"></view>
|
<view class="icon icon-add04 fon28"></view>
|
||||||
|
@ -20,22 +23,48 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</status-container>
|
</status-container>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import pitera from '@/components/nothing/pitera.vue';
|
import nothingPage from '@/components/nothing/nothing-page.vue';
|
||||||
export default {
|
export default {
|
||||||
components:{
|
components:{
|
||||||
pitera
|
nothingPage
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
addressList:[],
|
||||||
|
loading:false,
|
||||||
|
ifChoose:0
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
onShow() {
|
||||||
|
// 调取获取地址列表
|
||||||
|
this.getAddress();
|
||||||
|
},
|
||||||
|
onLoad(op) {
|
||||||
|
if(op.ifChoose) this.ifChoose = op.ifChoose;
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 选择地址
|
||||||
|
chooseAddress(item){
|
||||||
|
if(this.ifChoose){
|
||||||
|
uni.setStorageSync('addressInfo',item);
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取地址列表
|
||||||
|
getAddress(){
|
||||||
|
this.$requst.get('/api/user/address').then(res=>{
|
||||||
|
this.loading = true;
|
||||||
|
if(res.code==0){
|
||||||
|
// 设置地址列表
|
||||||
|
this.addressList = res.data;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -6,14 +6,14 @@
|
||||||
<view class="pad-sx30 pad-zy10 disjbac bbot">
|
<view class="pad-sx30 pad-zy10 disjbac bbot">
|
||||||
<view class="fon24 col26">头像</view>
|
<view class="fon24 col26">头像</view>
|
||||||
<view class="disac">
|
<view class="disac">
|
||||||
<image class="radius_100" src="https://s6.jpg.cm/2022/02/14/L4oDhy.jpg" mode="aspectFill" style="width: 92rpx;height: 92rpx;"></image>
|
<image class="radius_100" :src="userInfo.headimgurl" mode="aspectFill" style="width: 92rpx;height: 92rpx;"></image>
|
||||||
<view class="icon icon-next fon24 mar-z10" style="color: #7f7f7f;"></view>
|
<view class="icon icon-next fon24 mar-z10" style="color: #7f7f7f;"></view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="pad-sx30 fon24 pad-zy10 disjbac bbot">
|
<view class="pad-sx30 fon24 pad-zy10 disjbac bbot">
|
||||||
<view class="col26">昵称</view>
|
<view class="col26">昵称</view>
|
||||||
<view class="disac">
|
<view class="disac">
|
||||||
<view class="">zhengsnan</view>
|
<view class="">{{userInfo.nickname}}</view>
|
||||||
<view class="icon icon-next fon24 mar-z10" style="color: #FFFFFF;"></view>
|
<view class="icon icon-next fon24 mar-z10" style="color: #FFFFFF;"></view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -50,8 +50,14 @@
|
||||||
tipsTitle:'真实姓名',
|
tipsTitle:'真实姓名',
|
||||||
realName:'',//真实姓名字段
|
realName:'',//真实姓名字段
|
||||||
phone:'',//联系电话
|
phone:'',//联系电话
|
||||||
|
userInfo:''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.userInfo = uni.getStorageSync('userInfo');
|
||||||
|
this.realName = this.userInfo.real_name;
|
||||||
|
this.phone = this.userInfo.mobile;
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 发起修改
|
// 发起修改
|
||||||
chooseEv(index){
|
chooseEv(index){
|
||||||
|
|
|
@ -1,27 +1,27 @@
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<status-container titlet="地址新增" returnc="#FFFFFF">
|
<status-container :titlet="addressText" returnc="#FFFFFF">
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view slot="content" style="margin-top: -20rpx;">
|
||||||
<view class="bacf pad-x30 pad-zy20">
|
<view class="bacf pad-x30 pad-zy20">
|
||||||
<view class="pad20 disjbac bbot">
|
<view class="pad20 disjbac bbot">
|
||||||
<view class="fon24 col26 flexs width140">姓名</view>
|
<view class="fon24 col26 flexs width140">姓名</view>
|
||||||
<input type="text" class="width100 fon24" placeholder="收货人姓名" placeholder-style="color:#969696;">
|
<input type="text" v-model="userInfo.name" class="width100 fon24" placeholder="收货人姓名" placeholder-style="color:#969696;">
|
||||||
</view>
|
</view>
|
||||||
<view class="pad20 disjbac bbot">
|
<view class="pad20 disjbac bbot">
|
||||||
<view class="fon24 col26 flexs width140">电话</view>
|
<view class="fon24 col26 flexs width140">电话</view>
|
||||||
<input type="text" class="width100 fon24" placeholder="收货人手机号" placeholder-style="color:#969696;">
|
<input type="number" v-model="userInfo.phone" maxlength="11" class="width100 fon24" placeholder="收货人手机号" placeholder-style="color:#969696;">
|
||||||
</view>
|
</view>
|
||||||
<view class="pad20 disjbac bbot">
|
<view class="pad20 disjbac bbot">
|
||||||
<view class="fon24 col26 flexs width140">地区</view>
|
<view class="fon24 col26 flexs width140">地区</view>
|
||||||
<input type="text" class="width100 fon24" disabled placeholder="选择省/市/区" placeholder-style="color:#969696;">
|
<input @tap="openAddress" type="text" v-model="region" class="width100 fon24" disabled placeholder="选择省/市/区" placeholder-style="color:#969696;">
|
||||||
</view>
|
</view>
|
||||||
<view class="pad20 disjbac bbot">
|
<view class="pad20 disjbac bbot">
|
||||||
<view class="fon24 col26 flexs width140">详细地址</view>
|
<view class="fon24 col26 flexs width140">详细地址</view>
|
||||||
<input type="text" class="width100 fon24" placeholder="街道门牌、楼层房间号等信息" placeholder-style="color:#969696;">
|
<input type="text" v-model="userInfo.address" class="width100 fon24" placeholder="街道门牌、楼层房间号等信息" placeholder-style="color:#969696;">
|
||||||
</view>
|
</view>
|
||||||
<view class="pad20 disjbac bbot">
|
<view class="pad20 disjbac bbot">
|
||||||
<view class="fon24 col26 flexs width140">邮政编码</view>
|
<view class="fon24 col26 flexs width140">邮政编码</view>
|
||||||
<input type="text" class="width100 fon24" placeholder="邮政编码" placeholder-style="color:#969696;">
|
<input type="text" v-model="userInfo.postcode" class="width100 fon24" placeholder="邮政编码" placeholder-style="color:#969696;">
|
||||||
</view>
|
</view>
|
||||||
<view class="pad20 disjbac">
|
<view class="pad20 disjbac">
|
||||||
<view class="fon24 col26 flexs">设为默认收货地址</view>
|
<view class="fon24 col26 flexs">设为默认收货地址</view>
|
||||||
|
@ -30,30 +30,187 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="disjcac fc fon28 pad-s50">
|
<view class="disjcac fc fon28 pad-s50">
|
||||||
<!-- 保存 -->
|
<!-- 保存 -->
|
||||||
<view class="disjcac radius34" style="width: 670rpx;height: 80rpx;background-color: #f37717;color: #FFFFFF;border: 2rpx solid #f37717;">保存</view>
|
<view @tap="saveAddress" class="disjcac radius34" style="width: 670rpx;height: 80rpx;background-color: #f37717;color: #FFFFFF;border: 2rpx solid #f37717;">保存</view>
|
||||||
<!-- 删除 -->
|
<!-- 删除 -->
|
||||||
<view class="disjcac radius34 mar-s20 borbot-df" style="width: 670rpx;height: 80rpx;background-color: #FFFFFF;">删除</view>
|
<view @tap="delAddress" class="disjcac radius34 mar-s20 borbot-df" style="width: 670rpx;height: 80rpx;background-color: #FFFFFF;">删除</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</status-container>
|
</status-container>
|
||||||
|
<addressOne @choseVal="choseValue" :lotusAddressData="lotusAddressData"></addressOne>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import evanSwitch from '@/components/evan-switch/evan-switch.vue';
|
import evanSwitch from '@/components/evan-switch/evan-switch.vue';
|
||||||
|
import addressOne from '@/components/address-one/address-one.vue';
|
||||||
export default {
|
export default {
|
||||||
components:{
|
components:{
|
||||||
evanSwitch
|
evanSwitch,
|
||||||
|
addressOne
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
moAddress:false
|
moAddress:false,
|
||||||
|
addressText:'地址新增',
|
||||||
|
addressId:'',
|
||||||
|
userInfo:{
|
||||||
|
name:'',
|
||||||
|
phone:'',
|
||||||
|
address:'',
|
||||||
|
postcode:''
|
||||||
|
},
|
||||||
|
addressObj:{
|
||||||
|
province:'',
|
||||||
|
city:'',
|
||||||
|
county:'',
|
||||||
|
province_str:'',
|
||||||
|
city_str:'',
|
||||||
|
county_str:'',
|
||||||
|
},
|
||||||
|
lotusAddressData:{
|
||||||
|
visible:false,
|
||||||
|
provinceName:'',
|
||||||
|
cityName:'',
|
||||||
|
townName:'',
|
||||||
|
},
|
||||||
|
region:'',
|
||||||
|
flag:true,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(op) {
|
||||||
|
if(op.id){
|
||||||
|
this.addressText = "编辑地址";
|
||||||
|
this.addressId = op.id;
|
||||||
|
// 调用查看地址详情
|
||||||
|
this.getAddressDetail();
|
||||||
|
} else {
|
||||||
|
this.getDistrict();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 是否设为默认地址
|
// 是否设为默认地址
|
||||||
setMoAddress(status){
|
setMoAddress(status){
|
||||||
this.moAddress = status;
|
this.moAddress = status;
|
||||||
|
},
|
||||||
|
// 查看地址详情
|
||||||
|
getAddressDetail(){
|
||||||
|
this.$requst.post('/api/user/address-info',{id:this.addressId}).then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
// 设置地址信息
|
||||||
|
let addressInfo = res.data;
|
||||||
|
// 设置用户信息
|
||||||
|
this.userInfo.name = addressInfo.name;
|
||||||
|
this.userInfo.phone = addressInfo.phone;
|
||||||
|
this.userInfo.address = addressInfo.address;
|
||||||
|
this.userInfo.postcode = addressInfo.postcode;
|
||||||
|
// 设置默认收货地址是否开启/关闭
|
||||||
|
this.moAddress = addressInfo.is_default?true:false;
|
||||||
|
// 设置地区
|
||||||
|
this.addressObj.province = addressInfo.province;
|
||||||
|
this.addressObj.city = addressInfo.city;
|
||||||
|
this.addressObj.county = addressInfo.county;
|
||||||
|
this.addressObj.province_str = addressInfo.province_str;
|
||||||
|
this.addressObj.city_str = addressInfo.city_str;
|
||||||
|
this.addressObj.county_str = addressInfo.county_str;
|
||||||
|
this.setAddress(this.addressObj);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 保存或新增地址
|
||||||
|
saveAddress(){
|
||||||
|
if(this.flag && this.ifEmpty()){
|
||||||
|
this.flag = false;
|
||||||
|
let params = {
|
||||||
|
id:this.addressId,
|
||||||
|
...this.userInfo,
|
||||||
|
...this.addressObj,
|
||||||
|
is_default:this.moAddress?1:0
|
||||||
|
}
|
||||||
|
this.$requst.post('/api/user/address-save',params).then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
this.$toolAll.tools.showToast(this.addressId?'已编辑':'已新增')
|
||||||
|
setTimeout(()=>{
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
},500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 判空
|
||||||
|
ifEmpty(){
|
||||||
|
let result = false;
|
||||||
|
if(!this.userInfo.name){
|
||||||
|
this.$toolAll.tools.showToast('请输入姓名');
|
||||||
|
} else if(this.$toolAll.tools.isPhone(this.userInfo.phone)){
|
||||||
|
this.$toolAll.tools.showToast('请正确输入电话');
|
||||||
|
} else if(!this.region){
|
||||||
|
this.$toolAll.tools.showToast('请选择地区');
|
||||||
|
} else if(!this.userInfo.address){
|
||||||
|
this.$toolAll.tools.showToast('请填写详细地址');
|
||||||
|
} else {
|
||||||
|
result = true;
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
},
|
||||||
|
// 删除地址
|
||||||
|
delAddress(){
|
||||||
|
this.$requst.post('/api/user/address-del',{id:this.addressId}).then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
this.$toolAll.tools.showToast('删除成功');
|
||||||
|
setTimeout(()=>{
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
},500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 获取当前定位
|
||||||
|
getDistrict() {
|
||||||
|
uni.getLocation({
|
||||||
|
success:(res)=> {
|
||||||
|
uni.request({
|
||||||
|
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=B2ABZ-SIDKS-WD2O3-6CJ2U-CDZOT-U3FKF`,
|
||||||
|
header: {
|
||||||
|
'Content-Type':'application/json'
|
||||||
|
},
|
||||||
|
success:(res)=> {
|
||||||
|
console.log('地址数据:',res)
|
||||||
|
let info = res.data.result.address_component;
|
||||||
|
this.lotusAddressData.provinceName = info.province;//省
|
||||||
|
this.lotusAddressData.cityName = info.city;//市
|
||||||
|
this.lotusAddressData.townName = info.district;//区
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//打开picker
|
||||||
|
openAddress() {
|
||||||
|
this.lotusAddressData.visible = true;
|
||||||
|
},
|
||||||
|
//回传已选的省市区的值
|
||||||
|
choseValue(res){
|
||||||
|
//res数据源包括已选省市区与省市区code
|
||||||
|
console.log(res);
|
||||||
|
this.lotusAddressData.visible = res.visible;//visible为显示与关闭组件标识true显示false隐藏
|
||||||
|
//res.isChose = 1省市区已选 res.isChose = 0;未选
|
||||||
|
if(res.isChose){
|
||||||
|
this.setAddress({
|
||||||
|
province:res.provinceCode,
|
||||||
|
city:res.cityCode,
|
||||||
|
county:res.townCode,
|
||||||
|
province_str:res.province,
|
||||||
|
city_str:res.city,
|
||||||
|
county_str:res.town,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 设置省市区值
|
||||||
|
setAddress(obj){
|
||||||
|
this.addressObj = obj;
|
||||||
|
this.lotusAddressData.provinceName = obj.province_str;//省
|
||||||
|
this.lotusAddressData.cityName = obj.city_str;//市
|
||||||
|
this.lotusAddressData.townName = obj.county_str;//区
|
||||||
|
this.region = `${obj.province_str} ${obj.city_str} ${obj.county_str}`; //region为已选的省市区的值
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,12 +4,13 @@
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view slot="content" style="margin-top: -20rpx;">
|
||||||
<view class="bacf boxshowb posi-sticky" :style="{top:newtop+'px'}">
|
<view class="bacf boxshowb posi-sticky" :style="{top:newtop+'px'}">
|
||||||
<view class="pad-zy30 pad-sx24 disjbac pad-zy30 pad-sx20">
|
<view class="pad-zy30 pad-sx24 disjbac pad-zy30 pad-sx20">
|
||||||
<view class="fon26 col26">四川省成都市武侯区</view>
|
<view class="fon26 col26" v-if="addressInfo">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str}}</view>
|
||||||
<image @tap="$toolAll.tools.goPage(`/pagesB/add-address/add-address?id=${0}`)" src="/static/tabbar/icon-edit.png" mode="" style="width: 26rpx;height: 28rpx;" lazy-load></image>
|
<view class="fon26 col26" v-else></view>
|
||||||
|
<image @tap="$toolAll.tools.goPage(`/pagesB/add-address/add-address?id=${addressInfo.id}`)" src="/static/tabbar/icon-edit.png" mode="" style="width: 26rpx;height: 28rpx;" lazy-load></image>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="datalist.length" class="bacf mar-s30 pad-zy30 pad-x30 boxshowb">
|
<view v-if="datalist.length" class="bacf mar-s30 pad-zy30 pad-x30 boxshowb">
|
||||||
<view class="disac animated pad-sx30 bbot" :class="item.ifExit ? 'fadeInUp' : 'fadeOutDown'" :style="{display: item.ifShow ? 'flex' : 'none'}" v-for="(item,index) in datalist" :key="index">
|
<view class="disac animated pad-sx30 bbot" :class="item.ifExit ? 'fadeIn' : 'fadeOutDown'" :style="{display: item.ifShow ? 'flex' : 'none'}" v-for="(item,index) in datalist" :key="index">
|
||||||
<!-- 选择 -->
|
<!-- 选择 -->
|
||||||
<view class="flexs mo-item" :class="item.ifcheck ? 'active-item' : ''" @tap="chooseEv(index)"></view>
|
<view class="flexs mo-item" :class="item.ifcheck ? 'active-item' : ''" @tap="chooseEv(index)"></view>
|
||||||
<!-- 商品图片 -->
|
<!-- 商品图片 -->
|
||||||
|
@ -58,7 +59,7 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="disac">
|
<view class="disac">
|
||||||
<view class="">合计:<span class="fon38 colf8 bold">¥{{allPrice}}</span></view>
|
<view class="">合计:<span class="fon38 colf8 bold">¥{{allPrice}}</span></view>
|
||||||
<view @tap="goConfirmOrder" class="fon24 radius32 colf disjcac mar-z20" style="width: 184rpx;height: 64rpx;background-color: #f37617;">去支付</view>
|
<view @tap="goConfirmOrder" class="fon24 radius32 colf disjcac mar-z20" style="width: 184rpx;height: 64rpx;background-color: #f37617;">{{datalist.length?'去支付':'去购物'}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -87,11 +88,13 @@
|
||||||
originalNum:0,//当前输入框原值
|
originalNum:0,//当前输入框原值
|
||||||
maxNum:20,//最大可输入数量
|
maxNum:20,//最大可输入数量
|
||||||
minNum:1,//最小可输入数量
|
minNum:1,//最小可输入数量
|
||||||
|
addressInfo:''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
// 开启banner图自动轮播
|
// 开启banner图自动轮播
|
||||||
this.$store.commit('setAutoplay',true);
|
this.$store.commit('setAutoplay',true);
|
||||||
|
this.getAddress();
|
||||||
},
|
},
|
||||||
onHide() {
|
onHide() {
|
||||||
// 关闭banner图自动轮播
|
// 关闭banner图自动轮播
|
||||||
|
@ -123,11 +126,37 @@
|
||||||
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 获取地址列表
|
||||||
|
getAddress(){
|
||||||
|
this.$requst.get('/api/user/address').then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
// 设置地址列表
|
||||||
|
if(res.data.length){
|
||||||
|
res.data.forEach(item=>{
|
||||||
|
if(item.is_default){
|
||||||
|
this.addressInfo = item;
|
||||||
|
} else {
|
||||||
|
this.addressInfo = res.data[0];
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
// 前往确认订单页
|
// 前往确认订单页
|
||||||
goConfirmOrder(){
|
goConfirmOrder(){
|
||||||
uni.navigateTo({
|
if(this.datalist.length){
|
||||||
url:'/pagesB/confirm-order/confirm-order'
|
let exit = this.datalist.findIndex(item=>item.ifcheck==true);
|
||||||
})
|
if(exit!=-1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:'/pagesB/confirm-order/confirm-order'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
uni.reLaunch({
|
||||||
|
url:'/pages/tabbar/shop/shop'
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 全选事件
|
// 全选事件
|
||||||
chooseAllEv(){
|
chooseAllEv(){
|
||||||
|
@ -141,12 +170,16 @@
|
||||||
},
|
},
|
||||||
// 判断全选中是否被选中
|
// 判断全选中是否被选中
|
||||||
judgeSelectAllEv() {
|
judgeSelectAllEv() {
|
||||||
let exit = this.datalist.findIndex(item=>item.ifcheck==false);
|
if(this.datalist.length){
|
||||||
if(exit!=-1) {
|
let exit = this.datalist.findIndex(item=>item.ifcheck==false);
|
||||||
this.ifSelectAll = false
|
if(exit!=-1) {
|
||||||
|
this.ifSelectAll = false;
|
||||||
|
} else {
|
||||||
|
this.ifSelectAll = true;
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
this.ifSelectAll = true;
|
this.ifSelectAll = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 去商品详情事件
|
// 去商品详情事件
|
||||||
goDetail(id){
|
goDetail(id){
|
||||||
|
@ -170,6 +203,7 @@
|
||||||
this.datalist[index].ifExit = false;
|
this.datalist[index].ifExit = false;
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
this.datalist.splice(index,1);
|
this.datalist.splice(index,1);
|
||||||
|
this.judgeSelectAllEv();
|
||||||
},500)
|
},500)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,12 +2,13 @@
|
||||||
<view>
|
<view>
|
||||||
<status-container titlet="确认订单" returnc="#FFFFFF">
|
<status-container titlet="确认订单" returnc="#FFFFFF">
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view slot="content" style="margin-top: -20rpx;">
|
||||||
<view class="bacf disjbac fon24 pad-sx20 pad-zy30 boxshowb">
|
<view @tap="$toolAll.tools.goPage(`/pagesA/my-address/my-address?ifChoose=1`)" class="bacf disjbac fon24 pad-sx20 pad-zy30 boxshowb">
|
||||||
<view class="fon20 line-h40">
|
<view class="fon20 line-h40" v-if="addressInfo">
|
||||||
<view class="" style="color: #676767;">四川省成都市武侯区</view>
|
<view class="" style="color: #676767;">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str}}</view>
|
||||||
<view class="fon26">成华奥园广场三期6栋1418-1419</view>
|
<view class="fon26">{{addressInfo.address}}</view>
|
||||||
<view class="">郑珊珊 182****1234</view>
|
<view class="">{{addressInfo.name}} {{$toolAll.tools.hideMPhone(addressInfo.phone)}}</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="fon20 line-h40" v-else>请添加收货地址</view>
|
||||||
<view class="icon icon-next fon28" style="color: #777777;"></view>
|
<view class="icon icon-next fon28" style="color: #777777;"></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="bacf mar-s30 pad30 fon24 boxshowb">
|
<view class="bacf mar-s30 pad30 fon24 boxshowb">
|
||||||
|
@ -56,9 +57,13 @@
|
||||||
components:{'foot-tab' :footTab},
|
components:{'foot-tab' :footTab},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
addressInfo:''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
onShow() {
|
||||||
|
this.addressInfo = uni.getStorageSync('addressInfo');
|
||||||
|
console.log(this.addressInfo,77777);
|
||||||
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
<template>
|
<template>
|
||||||
<view v-if="isLoading">
|
<view>
|
||||||
<status-container titlet="课程详情" returnc="#FFFFFF">
|
<status-container titlet="课程详情" returnc="#FFFFFF">
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view v-if="isLoading" slot="content" style="margin-top: -20rpx;">
|
||||||
<view class="bacf">
|
<view class="bacf">
|
||||||
<view class="fon32 tcenter pad-s50">{{couresDetail.name}}</view>
|
<view class="fon32 tcenter pad-s50">{{couresDetail.name}}</view>
|
||||||
<view class="pad30 posir disjcac">
|
<view class="pad30 posir disjcac">
|
||||||
<image :src="couresDetail.cover" style="height: 388rpx;" mode="aspectFill" class="width100" lazy-load></image>
|
<image :src="couresDetail.cover" style="height: 388rpx;" mode="aspectFill" class="width100" lazy-load></image>
|
||||||
<image class="posia" src="/static/tabbar/icon-play.png" mode="" style="width: 70rpx;height: 70rpx;" lazy-load></image>
|
<image @tap="playVideo" class="posia" src="/static/tabbar/icon-play.png" mode="" style="width: 70rpx;height: 70rpx;" lazy-load></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="mar-zy30 bbot pad-x10">
|
<view class="mar-zy30 bbot pad-x10">
|
||||||
<span class="fon28 bold posir pad-x10">
|
<span class="fon28 bold posir pad-x10">
|
||||||
|
@ -120,6 +120,27 @@
|
||||||
url:`/pagesB/course-detail/course-detail?id=${id}&category_id=${this.classId}`
|
url:`/pagesB/course-detail/course-detail?id=${id}&category_id=${this.classId}`
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
// 播放视频
|
||||||
|
playVideo(){
|
||||||
|
if(!this.couresDetail[index].src){
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
wx.openChannelsActivity({
|
||||||
|
finderUserName:this.couresDetail[index].video_number,
|
||||||
|
feedId:this.couresDetail[index].subtitle,
|
||||||
|
success:(res)=>{},fail:()=>{
|
||||||
|
this.$toolAll.tools.showToast('视频已丢失或已删除')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// #endif
|
||||||
|
} else {
|
||||||
|
let newArr = [];
|
||||||
|
newArr.push(this.couresDetail[index])
|
||||||
|
uni.setStorageSync('videoList',newArr);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pagesB/play-video/play-video?current=${index}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<status-container titlet="产品详情" returnc="#FFFFFF">
|
<status-container titlet="产品详情" returnc="#FFFFFF">
|
||||||
<view slot="content" style="margin-top: -20rpx;">
|
<view v-if="loading" slot="content" style="margin-top: -20rpx;">
|
||||||
<view class="bacf boxshowb">
|
<view class="bacf boxshowb">
|
||||||
<swiper-pu newBottom="20rpx" newHeight="520rpx" :bannerList="bannerList"></swiper-pu>
|
<swiper-pu newBottom="20rpx" newHeight="520rpx" :bannerList="bannerList"></swiper-pu>
|
||||||
<view class="pad-zy30 pad-sx24">
|
<view class="pad-zy30 pad-sx24">
|
||||||
|
@ -19,8 +19,8 @@
|
||||||
<view class="posia-xzy" style="height: 6rpx;background-color: #e42417;bottom: -2rpx;"></view>
|
<view class="posia-xzy" style="height: 6rpx;background-color: #e42417;bottom: -2rpx;"></view>
|
||||||
</span>
|
</span>
|
||||||
</view>
|
</view>
|
||||||
<view class="pad-s30">
|
<view class="rich-text fon24 mar-s30" style="line-height: 1.8;">
|
||||||
<rich-text :nodes="richText"></rich-text>
|
<rich-text :nodes="richText" style="color: #5a5a5a;"></rich-text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 底部按钮 -->
|
<!-- 底部按钮 -->
|
||||||
|
@ -52,11 +52,13 @@
|
||||||
shopId:'',//产品id
|
shopId:'',//产品id
|
||||||
shopInfo:'',//产品详情
|
shopInfo:'',//产品详情
|
||||||
bannerList:[],//产品轮播
|
bannerList:[],//产品轮播
|
||||||
|
loading:false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
// 开启banner图自动轮播
|
// 开启banner图自动轮播
|
||||||
this.$store.commit('setAutoplay',true);
|
this.$store.commit('setAutoplay',true);
|
||||||
|
uni.removeStorageSync('addressInfo');
|
||||||
},
|
},
|
||||||
onHide() {
|
onHide() {
|
||||||
// 关闭banner图自动轮播
|
// 关闭banner图自动轮播
|
||||||
|
@ -72,6 +74,7 @@
|
||||||
getDetail(){
|
getDetail(){
|
||||||
this.$requst.post('/api/spu/detail',{id:this.shopId}).then(res=>{
|
this.$requst.post('/api/spu/detail',{id:this.shopId}).then(res=>{
|
||||||
if(res.code==0){
|
if(res.code==0){
|
||||||
|
this.loading = true;
|
||||||
// 设置产品详情
|
// 设置产品详情
|
||||||
this.shopInfo = res.data.detail;
|
this.shopInfo = res.data.detail;
|
||||||
// 富文本
|
// 富文本
|
||||||
|
@ -91,6 +94,13 @@
|
||||||
}
|
}
|
||||||
this.bannerList.push(obj);
|
this.bannerList.push(obj);
|
||||||
})
|
})
|
||||||
|
} else {
|
||||||
|
this.bannerList.push({
|
||||||
|
imgSrc:this.shopInfo.cover,
|
||||||
|
url:'',
|
||||||
|
isVideo:false,
|
||||||
|
poster:''
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue