对接新增地址、编辑地址、删除地址、获取地址、对接视频号
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,'用户信息')
|
||||
if(res.code==0) {
|
||||
this.userInfo = res.data;
|
||||
uni.setStorageSync('userInfo',this.userInfo);
|
||||
}
|
||||
uni.hideLoading();
|
||||
this.isLoading = true;
|
||||
|
|
|
|||
|
|
@ -179,10 +179,24 @@
|
|||
},
|
||||
// 播放视频
|
||||
palyVideo(index){
|
||||
uni.setStorageSync('videoList',this.videoList);
|
||||
if(!this.videoList[index].src){
|
||||
// #ifdef MP-WEIXIN
|
||||
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){
|
||||
|
|
|
|||
|
|
@ -90,10 +90,24 @@
|
|||
},
|
||||
// 播放视频
|
||||
palyVideo(index){
|
||||
uni.setStorageSync('videoList',this.dataList);
|
||||
if(!this.dataList[index].src){
|
||||
// #ifdef MP-WEIXIN
|
||||
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>
|
||||
<view>
|
||||
<status-container titlet="我的地址" returnc="#FFFFFF">
|
||||
<view slot="content" style="margin-top: -20rpx;">
|
||||
<view class="bacf pad-x30 pad-zy20" v-for="(item,index) in 10" :key="index">
|
||||
<view slot="content" style="margin-top: -20rpx;" v-if="loading">
|
||||
<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="fon22 col26">
|
||||
<view class="" style="color: #676767;">四川省成都市武侯区</view>
|
||||
<view class="mar-sx10">成华奥园广场三期6栋1418-1419</view>
|
||||
<view class="">郑珊珊 182****1234</view>
|
||||
<view class="" style="color: #676767;">{{item.province_str}}{{item.city_str}}{{item.county_str}}</view>
|
||||
<view class="mar-sx10">{{item.address}}</view>
|
||||
<view class="">{{item.name}} {{$toolAll.tools.hideMPhone(item.phone)}}</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 class="" v-if="!addressList.length">
|
||||
<nothingPage content="地址列表空荡荡滴"></nothingPage>
|
||||
</view>
|
||||
<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 class="icon icon-add04 fon28"></view>
|
||||
|
|
@ -20,22 +23,48 @@
|
|||
</view>
|
||||
</view>
|
||||
</status-container>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pitera from '@/components/nothing/pitera.vue';
|
||||
import nothingPage from '@/components/nothing/nothing-page.vue';
|
||||
export default {
|
||||
components:{
|
||||
pitera
|
||||
nothingPage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
addressList:[],
|
||||
loading:false,
|
||||
ifChoose:0
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// 调取获取地址列表
|
||||
this.getAddress();
|
||||
},
|
||||
onLoad(op) {
|
||||
if(op.ifChoose) this.ifChoose = op.ifChoose;
|
||||
},
|
||||
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>
|
||||
|
|
|
|||
|
|
@ -6,14 +6,14 @@
|
|||
<view class="pad-sx30 pad-zy10 disjbac bbot">
|
||||
<view class="fon24 col26">头像</view>
|
||||
<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>
|
||||
</view>
|
||||
<view class="pad-sx30 fon24 pad-zy10 disjbac bbot">
|
||||
<view class="col26">昵称</view>
|
||||
<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>
|
||||
</view>
|
||||
|
|
@ -50,8 +50,14 @@
|
|||
tipsTitle:'真实姓名',
|
||||
realName:'',//真实姓名字段
|
||||
phone:'',//联系电话
|
||||
userInfo:''
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.userInfo = uni.getStorageSync('userInfo');
|
||||
this.realName = this.userInfo.real_name;
|
||||
this.phone = this.userInfo.mobile;
|
||||
},
|
||||
methods: {
|
||||
// 发起修改
|
||||
chooseEv(index){
|
||||
|
|
|
|||
|
|
@ -1,27 +1,27 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-container titlet="地址新增" returnc="#FFFFFF">
|
||||
<status-container :titlet="addressText" returnc="#FFFFFF">
|
||||
<view slot="content" style="margin-top: -20rpx;">
|
||||
<view class="bacf pad-x30 pad-zy20">
|
||||
<view class="pad20 disjbac bbot">
|
||||
<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 class="pad20 disjbac bbot">
|
||||
<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 class="pad20 disjbac bbot">
|
||||
<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 class="pad20 disjbac bbot">
|
||||
<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 class="pad20 disjbac bbot">
|
||||
<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 class="pad20 disjbac">
|
||||
<view class="fon24 col26 flexs">设为默认收货地址</view>
|
||||
|
|
@ -30,30 +30,187 @@
|
|||
</view>
|
||||
<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>
|
||||
</status-container>
|
||||
<addressOne @choseVal="choseValue" :lotusAddressData="lotusAddressData"></addressOne>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import evanSwitch from '@/components/evan-switch/evan-switch.vue';
|
||||
import addressOne from '@/components/address-one/address-one.vue';
|
||||
export default {
|
||||
components:{
|
||||
evanSwitch
|
||||
evanSwitch,
|
||||
addressOne
|
||||
},
|
||||
data() {
|
||||
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: {
|
||||
// 是否设为默认地址
|
||||
setMoAddress(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 class="bacf boxshowb posi-sticky" :style="{top:newtop+'px'}">
|
||||
<view class="pad-zy30 pad-sx24 disjbac pad-zy30 pad-sx20">
|
||||
<view class="fon26 col26">四川省成都市武侯区</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-if="addressInfo">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str}}</view>
|
||||
<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 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>
|
||||
<!-- 商品图片 -->
|
||||
|
|
@ -58,7 +59,7 @@
|
|||
</view>
|
||||
<view class="disac">
|
||||
<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>
|
||||
|
|
@ -87,11 +88,13 @@
|
|||
originalNum:0,//当前输入框原值
|
||||
maxNum:20,//最大可输入数量
|
||||
minNum:1,//最小可输入数量
|
||||
addressInfo:''
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// 开启banner图自动轮播
|
||||
this.$store.commit('setAutoplay',true);
|
||||
this.getAddress();
|
||||
},
|
||||
onHide() {
|
||||
// 关闭banner图自动轮播
|
||||
|
|
@ -123,11 +126,37 @@
|
|||
|
||||
},
|
||||
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(){
|
||||
if(this.datalist.length){
|
||||
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(){
|
||||
|
|
@ -141,12 +170,16 @@
|
|||
},
|
||||
// 判断全选中是否被选中
|
||||
judgeSelectAllEv() {
|
||||
if(this.datalist.length){
|
||||
let exit = this.datalist.findIndex(item=>item.ifcheck==false);
|
||||
if(exit!=-1) {
|
||||
this.ifSelectAll = false
|
||||
this.ifSelectAll = false;
|
||||
} else {
|
||||
this.ifSelectAll = true;
|
||||
}
|
||||
} else {
|
||||
this.ifSelectAll = false;
|
||||
}
|
||||
},
|
||||
// 去商品详情事件
|
||||
goDetail(id){
|
||||
|
|
@ -170,6 +203,7 @@
|
|||
this.datalist[index].ifExit = false;
|
||||
setTimeout(()=>{
|
||||
this.datalist.splice(index,1);
|
||||
this.judgeSelectAllEv();
|
||||
},500)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,12 +2,13 @@
|
|||
<view>
|
||||
<status-container titlet="确认订单" returnc="#FFFFFF">
|
||||
<view slot="content" style="margin-top: -20rpx;">
|
||||
<view class="bacf disjbac fon24 pad-sx20 pad-zy30 boxshowb">
|
||||
<view class="fon20 line-h40">
|
||||
<view class="" style="color: #676767;">四川省成都市武侯区</view>
|
||||
<view class="fon26">成华奥园广场三期6栋1418-1419</view>
|
||||
<view class="">郑珊珊 182****1234</view>
|
||||
<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" v-if="addressInfo">
|
||||
<view class="" style="color: #676767;">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str}}</view>
|
||||
<view class="fon26">{{addressInfo.address}}</view>
|
||||
<view class="">{{addressInfo.name}} {{$toolAll.tools.hideMPhone(addressInfo.phone)}}</view>
|
||||
</view>
|
||||
<view class="fon20 line-h40" v-else>请添加收货地址</view>
|
||||
<view class="icon icon-next fon28" style="color: #777777;"></view>
|
||||
</view>
|
||||
<view class="bacf mar-s30 pad30 fon24 boxshowb">
|
||||
|
|
@ -56,9 +57,13 @@
|
|||
components:{'foot-tab' :footTab},
|
||||
data() {
|
||||
return {
|
||||
|
||||
addressInfo:''
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.addressInfo = uni.getStorageSync('addressInfo');
|
||||
console.log(this.addressInfo,77777);
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<view v-if="isLoading">
|
||||
<view>
|
||||
<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="fon32 tcenter pad-s50">{{couresDetail.name}}</view>
|
||||
<view class="pad30 posir disjcac">
|
||||
<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 class="mar-zy30 bbot 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}`
|
||||
})
|
||||
},
|
||||
// 播放视频
|
||||
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>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<view>
|
||||
<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">
|
||||
<swiper-pu newBottom="20rpx" newHeight="520rpx" :bannerList="bannerList"></swiper-pu>
|
||||
<view class="pad-zy30 pad-sx24">
|
||||
|
|
@ -19,8 +19,8 @@
|
|||
<view class="posia-xzy" style="height: 6rpx;background-color: #e42417;bottom: -2rpx;"></view>
|
||||
</span>
|
||||
</view>
|
||||
<view class="pad-s30">
|
||||
<rich-text :nodes="richText"></rich-text>
|
||||
<view class="rich-text fon24 mar-s30" style="line-height: 1.8;">
|
||||
<rich-text :nodes="richText" style="color: #5a5a5a;"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部按钮 -->
|
||||
|
|
@ -52,11 +52,13 @@
|
|||
shopId:'',//产品id
|
||||
shopInfo:'',//产品详情
|
||||
bannerList:[],//产品轮播
|
||||
loading:false
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// 开启banner图自动轮播
|
||||
this.$store.commit('setAutoplay',true);
|
||||
uni.removeStorageSync('addressInfo');
|
||||
},
|
||||
onHide() {
|
||||
// 关闭banner图自动轮播
|
||||
|
|
@ -72,6 +74,7 @@
|
|||
getDetail(){
|
||||
this.$requst.post('/api/spu/detail',{id:this.shopId}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.loading = true;
|
||||
// 设置产品详情
|
||||
this.shopInfo = res.data.detail;
|
||||
// 富文本
|
||||
|
|
@ -91,6 +94,13 @@
|
|||
}
|
||||
this.bannerList.push(obj);
|
||||
})
|
||||
} else {
|
||||
this.bannerList.push({
|
||||
imgSrc:this.shopInfo.cover,
|
||||
url:'',
|
||||
isVideo:false,
|
||||
poster:''
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue