jiazhipeng
4 months ago
18 changed files with 4338 additions and 23 deletions
@ -0,0 +1,196 @@ |
|||
function getLocalFilePath(path) { |
|||
if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('file://') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('/storage/emulated/0/') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('/') === 0) { |
|||
var localFilePath = plus.io.convertAbsoluteFileSystem(path) |
|||
if (localFilePath !== path) { |
|||
return localFilePath |
|||
} else { |
|||
path = path.substr(1) |
|||
} |
|||
} |
|||
return '_www/' + path |
|||
} |
|||
|
|||
function dataUrlToBase64(str) { |
|||
var array = str.split(',') |
|||
return array[array.length - 1] |
|||
} |
|||
|
|||
var index = 0 |
|||
function getNewFileId() { |
|||
return Date.now() + String(index++) |
|||
} |
|||
|
|||
function biggerThan(v1, v2) { |
|||
var v1Array = v1.split('.') |
|||
var v2Array = v2.split('.') |
|||
var update = false |
|||
for (var index = 0; index < v2Array.length; index++) { |
|||
var diff = v1Array[index] - v2Array[index] |
|||
if (diff !== 0) { |
|||
update = diff > 0 |
|||
break |
|||
} |
|||
} |
|||
return update |
|||
} |
|||
|
|||
export function pathToBase64(path) { |
|||
return new Promise(function(resolve, reject) { |
|||
if (typeof window === 'object' && 'document' in window) { |
|||
if (typeof FileReader === 'function') { |
|||
var xhr = new XMLHttpRequest() |
|||
xhr.open('GET', path, true) |
|||
xhr.responseType = 'blob' |
|||
xhr.onload = function() { |
|||
if (this.status === 200) { |
|||
let fileReader = new FileReader() |
|||
fileReader.onload = function(e) { |
|||
resolve(e.target.result) |
|||
} |
|||
fileReader.onerror = reject |
|||
fileReader.readAsDataURL(this.response) |
|||
} |
|||
} |
|||
xhr.onerror = reject |
|||
xhr.send() |
|||
return |
|||
} |
|||
var canvas = document.createElement('canvas') |
|||
var c2x = canvas.getContext('2d') |
|||
var img = new Image |
|||
img.onload = function() { |
|||
canvas.width = img.width |
|||
canvas.height = img.height |
|||
c2x.drawImage(img, 0, 0) |
|||
resolve(canvas.toDataURL()) |
|||
canvas.height = canvas.width = 0 |
|||
} |
|||
img.onerror = reject |
|||
img.src = path |
|||
return |
|||
} |
|||
if (typeof plus === 'object') { |
|||
plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) { |
|||
entry.file(function(file) { |
|||
var fileReader = new plus.io.FileReader() |
|||
fileReader.onload = function(data) { |
|||
resolve(data.target.result) |
|||
} |
|||
fileReader.onerror = function(error) { |
|||
reject(error) |
|||
} |
|||
fileReader.readAsDataURL(file) |
|||
}, function(error) { |
|||
reject(error) |
|||
}) |
|||
}, function(error) { |
|||
reject(error) |
|||
}) |
|||
return |
|||
} |
|||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { |
|||
wx.getFileSystemManager().readFile({ |
|||
filePath: path, |
|||
encoding: 'base64', |
|||
success: function(res) { |
|||
resolve('data:image/png;base64,' + res.data) |
|||
}, |
|||
fail: function(error) { |
|||
reject(error) |
|||
} |
|||
}) |
|||
return |
|||
} |
|||
reject(new Error('not support')) |
|||
}) |
|||
} |
|||
|
|||
export function base64ToPath(base64) { |
|||
return new Promise(function(resolve, reject) { |
|||
if (typeof window === 'object' && 'document' in window) { |
|||
base64 = base64.split(',') |
|||
var type = base64[0].match(/:(.*?);/)[1] |
|||
var str = atob(base64[1]) |
|||
var n = str.length |
|||
var array = new Uint8Array(n) |
|||
while (n--) { |
|||
array[n] = str.charCodeAt(n) |
|||
} |
|||
return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type }))) |
|||
} |
|||
var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/) |
|||
if (extName) { |
|||
extName = extName[1] |
|||
} else { |
|||
reject(new Error('base64 error')) |
|||
} |
|||
var fileName = getNewFileId() + '.' + extName |
|||
if (typeof plus === 'object') { |
|||
var basePath = '_doc' |
|||
var dirPath = 'uniapp_temp' |
|||
var filePath = basePath + '/' + dirPath + '/' + fileName |
|||
if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) { |
|||
plus.io.resolveLocalFileSystemURL(basePath, function(entry) { |
|||
entry.getDirectory(dirPath, { |
|||
create: true, |
|||
exclusive: false, |
|||
}, function(entry) { |
|||
entry.getFile(fileName, { |
|||
create: true, |
|||
exclusive: false, |
|||
}, function(entry) { |
|||
entry.createWriter(function(writer) { |
|||
writer.onwrite = function() { |
|||
resolve(filePath) |
|||
} |
|||
writer.onerror = reject |
|||
writer.seek(0) |
|||
writer.writeAsBinary(dataUrlToBase64(base64)) |
|||
}, reject) |
|||
}, reject) |
|||
}, reject) |
|||
}, reject) |
|||
return |
|||
} |
|||
var bitmap = new plus.nativeObj.Bitmap(fileName) |
|||
bitmap.loadBase64Data(base64, function() { |
|||
bitmap.save(filePath, {}, function() { |
|||
bitmap.clear() |
|||
resolve(filePath) |
|||
}, function(error) { |
|||
bitmap.clear() |
|||
reject(error) |
|||
}) |
|||
}, function(error) { |
|||
bitmap.clear() |
|||
reject(error) |
|||
}) |
|||
return |
|||
} |
|||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { |
|||
var filePath = wx.env.USER_DATA_PATH + '/' + fileName |
|||
wx.getFileSystemManager().writeFile({ |
|||
filePath: filePath, |
|||
data: dataUrlToBase64(base64), |
|||
encoding: 'base64', |
|||
success: function() { |
|||
resolve(filePath) |
|||
}, |
|||
fail: function(error) { |
|||
reject(error) |
|||
} |
|||
}) |
|||
return |
|||
} |
|||
reject(new Error('not support')) |
|||
}) |
|||
} |
|||
@ -0,0 +1,11 @@ |
|||
{ |
|||
"id": "mmmm-image-tools", |
|||
"name": "image-tools", |
|||
"version": "1.4.0", |
|||
"description": "图像转换工具，可用于图像和base64的转换", |
|||
"keywords": [ |
|||
"base64", |
|||
"保存", |
|||
"图像" |
|||
] |
|||
} |
|||
@ -0,0 +1,424 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<!-- 列表 --> |
|||
<view class="coupon-list" v-if="list.length>0"> |
|||
<view class="coupon-item" v-for="(item, index) in list" :key="index"> |
|||
<!-- 分割线上部分 --> |
|||
<view class="item-top"> |
|||
<view class="top-left"> |
|||
<view class="price" v-if="item.activity.discount_type == 'pricebreak'"> |
|||
<span>{{item.activity.money/100}}</span>元 |
|||
</view> |
|||
<view class="price" v-else> |
|||
<span>{{item.activity.fold}}</span>折 |
|||
</view> |
|||
<view class="subtitle"> |
|||
满{{item.activity.mini_money/100}}元可用 |
|||
</view> |
|||
</view> |
|||
<view class="top-right"> |
|||
<view class="title"> |
|||
{{item.activity.name}} |
|||
</view> |
|||
<view class="time"> |
|||
{{item.get_date.slice(0,10)}}-{{item.end_time.slice(0,10)}}可用 |
|||
</view> |
|||
</view> |
|||
<image class="selected" v-if="item.selected" @click="selectCoupon(item,index)" :src="showImg('/uploads/20241104/f304eab8fe780e63507c9a43c5135cb7.png')" mode=""></image> |
|||
<view v-else class="yuan" @click="selectCoupon(item,index)"></view> |
|||
</view> |
|||
<!-- 分割线 --> |
|||
<view class="item-circle"> |
|||
<view class="circle left"></view> |
|||
<view class="line"></view> |
|||
<view class="circle right"></view> |
|||
</view> |
|||
<!-- 分割线下部分 --> |
|||
<view class="item-bottom"> |
|||
<view class="rules" @click="changeRules(item,index)"> |
|||
<span v-if="!item.openRules">使用规则：{{item.activity.use_rule_text}}</span> |
|||
<view class="open" v-else>使用规则：{{item.activity.use_rule_text}}</view> |
|||
<image v-if="!item.openRules" src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/6a7630c176f976bb16674dde482779fb.png" mode=""></image> |
|||
<image v-else src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/f0073b18b3ab88cac62de60411360fc1.png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-else class="noCoupon"> |
|||
<img src="https://static.ticket.sz-trip.com/tongli/images/user/couponNo.png" class="no-couPon"> |
|||
<view>暂无优惠券</view> |
|||
</view> |
|||
|
|||
<view class="bottom-btn" v-if="list.length>0"> |
|||
<view class="left" v-if="item.percent == 0"> |
|||
优惠： |
|||
<span style="font-size: 24rpx;color:#6A8A2D;margin-left: 19.33rpx;">￥</span> |
|||
<span style="font-size: 48rpx;color:#6A8A2D;font-weight: bold;">{{reducePrice}}</span> |
|||
</view> |
|||
<view class="left" v-else> |
|||
优惠： |
|||
<span style="font-size: 48rpx;color:#6A8A2D;font-weight: bold;">{{reducePrice}}</span> |
|||
</view> |
|||
<!-- <view class="sure" @click="setCoupon(reducePrice*100)"> --> |
|||
<view class="sure" @click="setCoupon(coupon)"> |
|||
确定 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
openRules: false, |
|||
list:[], |
|||
couponSel:false, |
|||
allPrice:0, |
|||
sku_ids:'', |
|||
reducePrice: 0, |
|||
coupon:{}, |
|||
needDefault:false |
|||
} |
|||
}, |
|||
onShow() { |
|||
this.getList(); |
|||
}, |
|||
onLoad(options) { |
|||
this.allPrice = (options.allprice) /100 |
|||
this.sku_ids = options.sku_ids |
|||
this.needDefault = options.needDefault |
|||
console.log('11111',options); |
|||
}, |
|||
methods: { |
|||
getPecenet:function (percent) { |
|||
if(percent>=100 || percent<=0) return ""; |
|||
percent = 100 - percent; |
|||
if(percent%10==0){ |
|||
percent = percent/10; |
|||
} |
|||
return percent |
|||
}, |
|||
// 选择优惠券 |
|||
selectCoupon(item,index) { |
|||
let list = this.list |
|||
list.forEach((Item, Index) => { |
|||
if (Index === index) { |
|||
Item.selected = !Item.selected |
|||
} else { |
|||
Item.selected = false |
|||
} |
|||
}) |
|||
this.list = list |
|||
console.log('选中的',this.list[index].selected); |
|||
if(item.selected) { |
|||
if (item.activity.discount_type == 'pricebreak') { |
|||
this.reducePrice = item.activity.mini_money/100+'元' |
|||
this.coupon = item |
|||
} else{ |
|||
this.coupon = item |
|||
this.reducePrice = item.activity.fold+'折' |
|||
} |
|||
}else { |
|||
this.reducePrice = 0 |
|||
this.coupon = {} |
|||
} |
|||
this.$forceUpdate() |
|||
|
|||
}, |
|||
// 打开使用规则 |
|||
changeRules(item,index){ |
|||
let coupons = this.list |
|||
coupons.forEach((Item, Index) => { |
|||
if (Index === index) { |
|||
Item.openRules = !Item.openRules |
|||
} else { |
|||
Item.openRules = false |
|||
} |
|||
}) |
|||
this.list = coupons |
|||
this.$forceUpdate() |
|||
}, |
|||
// 处理价格 |
|||
showNoPriceNew(price) { |
|||
if (price && price > 0) { |
|||
return (price / 100) |
|||
} else { |
|||
return '0' |
|||
} |
|||
}, |
|||
getList:function () { |
|||
this.Post({ |
|||
money:this.allPrice, |
|||
sku_ids:this.sku_ids |
|||
}, "/api/coupon/use_coupon_list").then((res) => { |
|||
this.list = res.data |
|||
this.list.forEach(item => { |
|||
item.selected = false |
|||
}) |
|||
if (this.needDefault) { |
|||
this.calMaxCost() |
|||
} |
|||
}) |
|||
}, |
|||
setCoupon(item) { |
|||
if (item.id) { |
|||
console.log('选择的优惠券',item); |
|||
this.$store.commit("choseCoupon",item); |
|||
} else{ |
|||
this.$store.commit("choseCoupon",""); |
|||
} |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
// 计算最大优惠的券 |
|||
calMaxCost () { |
|||
let maxCost = {} |
|||
let maxCostPrice = 0 |
|||
let index = -1 |
|||
this.list.forEach((item,i)=>{ |
|||
let reducePrice = 0 |
|||
if (item.activity.discount_type == 'pricebreak') { |
|||
reducePrice = item.activity.money/100 |
|||
} else{ |
|||
reducePrice = this.allPrice * item.activity.fold |
|||
} |
|||
|
|||
if (reducePrice > maxCostPrice) { |
|||
maxCostPrice = reducePrice |
|||
maxCost = item |
|||
index = i |
|||
} |
|||
}) |
|||
|
|||
if (maxCost.id) { |
|||
this.selectCoupon(maxCost, index) |
|||
} |
|||
|
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.bg { |
|||
background: #F7F7F7; |
|||
min-height: 100vh; |
|||
} |
|||
.coupon-list .coupon-item .item-circle { |
|||
line-height: 1rpx; |
|||
height: 1rpx; |
|||
width: 652rpx; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-circle .line { |
|||
border-bottom: 1px dashed #ccc; |
|||
top: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
height: .1rpx; |
|||
margin: auto; |
|||
z-index: 9; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-circle .circle { |
|||
position: absolute; |
|||
top: 0; |
|||
bottom: 0; |
|||
margin: auto; |
|||
border-radius: 50%; |
|||
background: #ccc; |
|||
width: .46rpx; |
|||
height: .46rpx; |
|||
z-index: 10; |
|||
} |
|||
.coupon-list .coupon-item .item-circle .circle.left{ |
|||
left:-.23rpx; |
|||
} |
|||
.coupon-list .coupon-item .item-circle .circle.right{ |
|||
right: -.23rpx; |
|||
} |
|||
|
|||
.item-bottom { |
|||
padding: 16rpx 20rpx; |
|||
display: flex; |
|||
align-items: flex-start; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.item-bottom .rules { |
|||
font-size: 24rpx; |
|||
font-weight: 500; |
|||
color: #999; |
|||
display: flex; |
|||
line-height: 47rpx; |
|||
} |
|||
|
|||
.item-bottom .rules span { |
|||
width: 570rpx; |
|||
overflow: hidden; //超出隐藏 |
|||
white-space: nowrap; //不折行 |
|||
text-overflow: ellipsis; |
|||
} |
|||
|
|||
.item-bottom .rules image { |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 20rpx; |
|||
margin-top: 15rpx; |
|||
} |
|||
|
|||
.open { |
|||
width: 570rpx; |
|||
min-height: 30rpx; |
|||
flex-wrap: wrap; |
|||
} |
|||
.coupon-item { |
|||
margin: 20.67rpx 26.67rpx; |
|||
background: #fff; |
|||
} |
|||
.coupon-list .coupon-item .item-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding: 30rpx 16rpx 24rpx 36rpx; |
|||
} |
|||
|
|||
.coupon-item .item-top .price { |
|||
font-size: 25rpx; |
|||
font-weight: bold; |
|||
color: #6A8A2D; |
|||
display: flex; |
|||
align-items: baseline; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.coupon-item .item-top .price span { |
|||
font-size: 67rpx; |
|||
margin-right: 6.67rpx; |
|||
} |
|||
|
|||
.top-left .subtitle { |
|||
width: 100%; |
|||
font-size: 24rpx; |
|||
color: #6A8A2D; |
|||
padding-left: 6rpx; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
.top-right { |
|||
width: 336rpx; |
|||
margin-left: 46.67rpx; |
|||
font-size: 25rpx; |
|||
font-weight: 500; |
|||
color: #111; |
|||
} |
|||
|
|||
.top-right .title { |
|||
margin-bottom: 26rpx; |
|||
font-size: 31rpx; |
|||
font-weight: bold; |
|||
width: 100%; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
.item-bottom { |
|||
padding: 16rpx 20rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.item-bottom .use { |
|||
width: 133rpx; |
|||
height: 47rpx; |
|||
border: 1px solid #6A8A2D; |
|||
border-radius: 23rpx; |
|||
text-align: center; |
|||
font-size: 25rpx; |
|||
font-weight: 500; |
|||
color: #6A8A2D; |
|||
line-height: 47rpx; |
|||
} |
|||
.coupon-list{ |
|||
background: #F7F7F7; |
|||
min-height: 100vh; |
|||
padding: 20rpx 20rpx 160rpx; |
|||
} |
|||
|
|||
.coupon-list .coupon-item { |
|||
background: #ffffff; |
|||
border-radius: 13rpx; |
|||
} |
|||
.yuan { |
|||
width: 37rpx; |
|||
height: 37rpx; |
|||
border: 1px solid #999999; |
|||
border-radius: 20rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.selected { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin-right: 16rpx; |
|||
} |
|||
.bottom-btn { |
|||
/* width: 100%; */ |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
padding: 22rpx 50rpx 64rpx 50.67rpx; |
|||
background: #fff; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.bottom-btn .left { |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #393B3E; |
|||
} |
|||
.sure { |
|||
width: 250rpx; |
|||
height: 80rpx; |
|||
background: #6A8A2D; |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
font-weight: bold; |
|||
text-align: center; |
|||
line-height: 80rpx; |
|||
border-radius: 50rpx; |
|||
} |
|||
.top-left { |
|||
width: 136rpx; |
|||
} |
|||
.top-left .price { |
|||
width: 100%; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
.noCoupon{ |
|||
padding-top: 524rpx; |
|||
text-align: center; |
|||
font-size: 31rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
.no-couPon{ |
|||
width: 173rpx; |
|||
height: 173rpx; |
|||
margin-bottom: 15rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,678 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="top-bg"> |
|||
<view class="search-box"> |
|||
<view class="left"> |
|||
<image src="https://static.ticket.sz-trip.com/yandu/images/eventCalendar/search.png" |
|||
mode="aspectFill"></image> |
|||
<input v-model="keywords" type="text" placeholder="请输入关键字" @confirm="search()" /> |
|||
</view> |
|||
|
|||
<!-- <view class="btn" @click="search()">搜索</view> --> |
|||
</view> |
|||
<view class="common-box"> |
|||
<view class="common-types com-flex-tao"> |
|||
<view @click="setType(index)" v-for="(item, index) in typeList" :key="item.id" |
|||
:class="['common-type', typeIndex == index ? 'active' : '']"> |
|||
{{ item.name }} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="list-common-empty" v-if="list.length == 0"> |
|||
<img src="https://static.ticket.sz-trip.com/shiweisuzhou/images/user/noTrades.png" /> |
|||
<p class="list-common-empty-tip">还没有订单，赶快去下单吧~</p> |
|||
</view> |
|||
<view class="trade-list" v-if="list.length > 0"> |
|||
<view v-for="(item, key) in list" :key="item.id" class="trade-items" v-if="showItem(item)" |
|||
@click="() => choseType(item)"> |
|||
<view class="trade-item-head"> |
|||
<view class="trade-item-head-tid">订单号:{{ item.order_id }}</view> |
|||
<view class="trade-item-head-state">{{ item.status_text }}</view> |
|||
</view> |
|||
<view class="trade-item-pros"> |
|||
<view class="trade-item-pro" v-for="(pro, proIndex) in item.order_child" :key="pro.child_id"> |
|||
<view class="trade-item-pro-img" v-if="pro.specifications_image"> |
|||
<image :src="showImg(pro.specifications_image)" mode="aspectFill"></image> |
|||
</view> |
|||
<view style="flex: 1;"> |
|||
<view class="trade-item-pro-title">{{ pro.goods_title }}</view> |
|||
<view class="trade-item-pro-subtitle">{{ pro.specifications_name }}</view> |
|||
</view> |
|||
<view class="trade-item-pro-price"> |
|||
<view class="trade-item-pro-price-pri">￥{{ pro.pay_money / 100 }}</view> |
|||
<view class="trade-item-pro-num">x{{ pro.num }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="trade-item-info"> |
|||
合计 |
|||
<text>￥{{ item.pay_money / 100 }}</text> |
|||
</view> |
|||
<view class="trade-item-btns"> |
|||
<view @click.stop="() => refund(item.order_id, key)" v-if="item.status == 'PAYMENT_SUCCESSFULLY'"> |
|||
申请退款</view> |
|||
<view @click.stop="() => closeOrder(item.order_id, item)" v-if="item.status == 'WAIT_PAYMENT'">关闭订单 |
|||
</view> |
|||
<view @click.stop="confirmpost(item.order_id, key)" v-if="item.postFlag">确认收货</view> |
|||
<view class="pay-btn" @click.stop="setOrderId(item.order_id)" v-if="item.status == 'WAIT_PAYMENT'"> |
|||
立即支付</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- <view v-if="list.length === 0 && finished" class="noDate"> |
|||
<view>暂无订单</view> |
|||
</view> --> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'Trades', |
|||
data() { |
|||
return { |
|||
finished: false, |
|||
list: [], |
|||
typeList: [{ |
|||
id: 'ALL', |
|||
name: '全部' |
|||
}, |
|||
{ |
|||
id: 'WAIT_PAYMENT', |
|||
name: '待付款' |
|||
}, |
|||
{ |
|||
id: 'PAYMENT_SUCCESSFULLY', |
|||
name: '待使用' |
|||
}, |
|||
{ |
|||
id: 'PAYMENT_SUCCESSFULLY', |
|||
name: '待发货' |
|||
}, |
|||
{ |
|||
id: 'POST', |
|||
name: '待收货' |
|||
}, |
|||
// { |
|||
// id: 'WAIT_COMMENT', |
|||
// name: '待评价' |
|||
// }, |
|||
{ |
|||
id: 'WAIT_REFUND,REFUND_SUCCESS,REFUND_REFUSAL,REFUND_ERROR,REFUND_PART', |
|||
name: '退款/售后' |
|||
} |
|||
], |
|||
typeIndex: 0, |
|||
ajaxFlag: true, |
|||
keywords: '', |
|||
orderId: null, |
|||
dateRange: [], |
|||
type: '' |
|||
}; |
|||
}, |
|||
onLoad(options) { |
|||
console.log(options); |
|||
if (options.type) this.typeIndex = this.typeList.findIndex(vm => vm.name === options.type); |
|||
uni.$on("updateDataByConnect", this.getDataByConnect) |
|||
}, |
|||
onShow() { |
|||
this.getList(); |
|||
}, |
|||
onUnload() { |
|||
uni.$off("updateDataByConnect", this.getDataByConnect) |
|||
}, |
|||
onReachBottom() { |
|||
if (this.finished) return false; |
|||
this.getList(); |
|||
}, |
|||
methods: { |
|||
getDataByConnect(data) { |
|||
if (data.msgType == "updateOrderTrades") { |
|||
this.list = []; |
|||
this.finished = false; |
|||
this.getList() |
|||
} |
|||
}, |
|||
emptyFunc() { |
|||
|
|||
}, |
|||
showItem(item) { |
|||
let flag = true; |
|||
// if (this.typeIndex == 2 && item.order_child[0] && !item.order_child[0].consignee) flag = false |
|||
return flag; |
|||
}, |
|||
onReload() { |
|||
this.list = []; |
|||
this.finished = false; |
|||
this.getList(); |
|||
}, |
|||
setType(index) { |
|||
this.typeIndex = index; |
|||
this.onReload(); |
|||
}, |
|||
setOrderId(id) { |
|||
let that = this; |
|||
that.orderId = id; |
|||
that.Post({ |
|||
order_id: id, |
|||
type: "miniprogram", |
|||
platform: 'miniprogram' |
|||
}, |
|||
'/api/pay/unify' |
|||
).then(res => { |
|||
if (res.data) { |
|||
uni.requestPayment({ |
|||
nonceStr: res.data.nonceStr, |
|||
package: res.data.package, |
|||
paySign: res.data.paySign, |
|||
signType: res.data.signType, |
|||
timeStamp: res.data.timeStamp, |
|||
success: () => { |
|||
const templateIds = [ |
|||
// 退款成功通知 |
|||
'hRZoiEES2BWtKb6Xgsnn8khLQH9un5j_11qu0bwlhfE', |
|||
// 出票结果通知 |
|||
'YyTCUIYBnrj9CyKks8cOjNX_Rk8a4yVdswMP-zXVbhc' |
|||
] |
|||
uni.requestSubscribeMessage({ |
|||
tmplIds: templateIds, |
|||
complete (res) { |
|||
that.list = []; |
|||
that.finished = false; |
|||
that.getList() |
|||
} |
|||
}) |
|||
} |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
// 确认收货 |
|||
confirmpost(id, index) { |
|||
let that = this; |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '是否确认收货？', |
|||
success: successRes => { |
|||
if (successRes.confirm) { |
|||
that.Post({ |
|||
order_id: id |
|||
}, |
|||
'/api/order/confirmPost' |
|||
).then(res => { |
|||
if (res.code == 1) { |
|||
list[index].order_child.map(item => { |
|||
item.status = 'WAIT_COMMENT'; |
|||
}); |
|||
list[index].status = 'WAIT_COMMENT'; |
|||
list[index].postFlag = false; |
|||
that.list = list; |
|||
uni.showToast({ |
|||
title: '操作成功' |
|||
}); |
|||
that.$forceUpdate(); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
// 关闭订单 |
|||
closeOrder(id, index) { |
|||
console.log(id); |
|||
console.log(index); |
|||
let that = this; |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '是否关闭订单？', |
|||
success: successRes => { |
|||
if (successRes.confirm) { |
|||
that.Post({ |
|||
order_id: id |
|||
}, |
|||
'/api/order/closeOrder' |
|||
).then(res => { |
|||
if (res.code == 1) { |
|||
uni.showToast({ |
|||
title: '关闭成功', |
|||
icon: 'success' |
|||
}); |
|||
that.list = []; |
|||
that.finished = false; |
|||
that.getList(); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
//删除订单 |
|||
deletOrder(id) { |
|||
let that = this; |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '是否删除订单？', |
|||
success: successRes => { |
|||
if (successRes.confirm) { |
|||
that.Post({ |
|||
order_id: id |
|||
}, |
|||
'/api/order/delOrder' |
|||
).then(res => { |
|||
if (res.code == 1) { |
|||
uni.showToast({ |
|||
title: '删除成功', |
|||
icon: 'success' |
|||
}); |
|||
that.list = []; |
|||
that.finished = false; |
|||
that.getList(); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
// 申请退款 |
|||
refund(id, index) { |
|||
console.log(id); |
|||
let that = this; |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '是否申请退款？', |
|||
success: successRes => { |
|||
if (successRes.confirm) { |
|||
that.Post({ |
|||
order_id: id |
|||
}, |
|||
'/api/order/applyRefund' |
|||
).then(res => { |
|||
if (res.code == 1) { |
|||
uni.showToast({ |
|||
title: '申请成功', |
|||
icon: 'success' |
|||
}); |
|||
that.onReload(); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
search(e) { |
|||
this.list = []; |
|||
this.getList(); |
|||
// if (e.keyCode == 13) { |
|||
// // 提交 |
|||
// this.keywords = e.target.value; |
|||
// } |
|||
}, |
|||
getList() { |
|||
let data = { |
|||
status: this.typeList[this.typeIndex].id == 'ALL' ? '' : this.typeList[this.typeIndex].true_id || |
|||
this.typeList[this.typeIndex].id, |
|||
offset: this.list.length, |
|||
limit: 5, |
|||
name: this.keywords, |
|||
type: this.typeList[this.typeIndex].name == '待使用' ? 1 : (this.typeList[this.typeIndex].name == |
|||
'待发货' ? 2 : '') |
|||
}; |
|||
this.Post(data, '/api/order/orderList').then(res => { |
|||
this.list = [...this.list, ...res.data] |
|||
if (res.data.length < 5) { |
|||
this.finished = true; |
|||
} |
|||
}); |
|||
}, |
|||
UpdateOrder(id) { |
|||
this.ajaxFlag = false; |
|||
let list = this.list; |
|||
this.Post({ |
|||
order_id: id |
|||
}, |
|||
'/api/order/orderDetail' |
|||
).then(res => { |
|||
this.ajaxFlag = true; |
|||
list.map(item => { |
|||
if (item.order_id == id) { |
|||
item = res.data; |
|||
} |
|||
}); |
|||
this.list = list; |
|||
}); |
|||
}, |
|||
choseType(item) { |
|||
uni.navigateTo({ |
|||
url: '/subPackages/order/detail?id=' + item.order_id |
|||
}); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
view { |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.common-box { |
|||
height: 90rpx; |
|||
} |
|||
|
|||
.common-types { |
|||
background: white; |
|||
height: 90rpx; |
|||
font-size: 31rpx; |
|||
z-index: 10; |
|||
margin: auto; |
|||
color: #666; |
|||
overflow-x: scroll; |
|||
overflow-y: hidden; |
|||
padding: 0 27rpx; |
|||
} |
|||
|
|||
.common-types::-webkit-scrollbar { |
|||
width: 0rpx; |
|||
height: 0; |
|||
display: none; |
|||
} |
|||
|
|||
.common-type { |
|||
flex-shrink: 0; |
|||
margin: 0 26rpx; |
|||
line-height: 90rpx; |
|||
height: 90rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.common-type.active { |
|||
font-size: 31rpx; |
|||
font-weight: bold; |
|||
color: #000; |
|||
} |
|||
|
|||
.common-type.active:after { |
|||
display: block; |
|||
width: 60%; |
|||
font-size: 0; |
|||
content: '1'; |
|||
margin: auto; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 1rpx; |
|||
height: 4rpx; |
|||
background: #6A8A27; |
|||
border-radius: 2rpx; |
|||
} |
|||
|
|||
.bg { |
|||
min-height: 100vh; |
|||
background-color: #f7f7f7; |
|||
} |
|||
|
|||
.noDate { |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
margin-top: 200rpx; |
|||
} |
|||
|
|||
.noDate img { |
|||
width: 514rpx; |
|||
height: auto; |
|||
} |
|||
|
|||
.noDate view { |
|||
font-size: 24rpx; |
|||
color: #777777; |
|||
} |
|||
|
|||
.trade-list { |
|||
padding: 28rpx 26rpx; |
|||
} |
|||
|
|||
.trade-items { |
|||
background-color: white; |
|||
margin-bottom: 28rpx; |
|||
border-radius: 20rpx; |
|||
} |
|||
|
|||
.trade-item-head { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
padding: 28rpx 20rpx; |
|||
border-bottom: 1rpx solid #d8d8d8; |
|||
} |
|||
|
|||
.trade-item-head-tid { |
|||
font-size: 24rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
color: #666666; |
|||
} |
|||
|
|||
.trade-item-head-state { |
|||
font-size: 27rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #C3282E; |
|||
} |
|||
|
|||
.trade-item-head-name { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
font-size: 31rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
|
|||
image { |
|||
width: 33rpx; |
|||
height: 31rpx; |
|||
} |
|||
|
|||
view { |
|||
margin-left: 13rpx; |
|||
} |
|||
} |
|||
|
|||
.trade-item-pros { |
|||
display: flex; |
|||
/* background-color: #F2F2F2; */ |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.trade-item-pro { |
|||
display: flex; |
|||
padding: 20rpx; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.trade-item-pro-img { |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.trade-item-pro-img image { |
|||
width: 180rpx; |
|||
height: 180rpx; |
|||
border-radius: 10rpx; |
|||
} |
|||
|
|||
.trade-item-pro-price { |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.trade-item-pro-title { |
|||
text-align: left; |
|||
flex: 1; |
|||
padding: 0 20rpx; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.trade-item-pro-subtitle { |
|||
text-align: left; |
|||
flex: 1; |
|||
padding: 0 20rpx; |
|||
font-weight: 500; |
|||
font-size: 24rpx; |
|||
color: #C3282E; |
|||
margin-top: 20rpx; |
|||
} |
|||
|
|||
.trade-item-pro-price view { |
|||
display: flex; |
|||
flex-wrap: nowrap; |
|||
text-wrap: none; |
|||
white-space: nowrap; |
|||
justify-content: flex-end; |
|||
} |
|||
|
|||
.trade-item-pro-price-pri { |
|||
font-size: 27rpx; |
|||
color: #C3282E; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
.trade-item-pro-num { |
|||
font-size: 24rpx; |
|||
color: #666666; |
|||
margin-top: 24rpx; |
|||
} |
|||
|
|||
.trade-item-info { |
|||
font-size: 28rpx; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
align-items: center; |
|||
background-color: white; |
|||
padding: 0rpx 20rpx; |
|||
margin-top: -6rpx; |
|||
/* border-bottom: 1px solid #B6B6B6; */ |
|||
} |
|||
|
|||
.trade-item-info text { |
|||
font-size: 36rpx; |
|||
font-weight: bold; |
|||
color: rgba(238, 0, 0, 1); |
|||
} |
|||
|
|||
.trade-item-btns { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: flex-end; |
|||
align-items: center; |
|||
padding: 20rpx; |
|||
} |
|||
|
|||
.trade-item-btns view { |
|||
margin-left: 20rpx; |
|||
background: rgba(237, 237, 237, 0); |
|||
border: 1rpx solid #999999; |
|||
border-radius: 27rpx; |
|||
padding: 8rpx 16rpx; |
|||
font-size: 27rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
.trade-item-btns .pay-btn { |
|||
color: #FFFFFF; |
|||
background: #C3282E; |
|||
border: none; |
|||
padding: 10rpx 16rpx; |
|||
} |
|||
|
|||
.comment-btn { |
|||
width: 100rpx; |
|||
text-align: center; |
|||
line-height: 40rpx; |
|||
border-radius: 20rpx; |
|||
border: 1px solid #999999; |
|||
color: #333333; |
|||
justify-content: center !important; |
|||
font-size: 24rpx; |
|||
margin-top: 16rpx; |
|||
} |
|||
|
|||
.list-common-empty { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
min-height: 50vh; |
|||
} |
|||
|
|||
.list-common-empty img { |
|||
width: 317.33rpx; |
|||
height: 282rpx; |
|||
} |
|||
|
|||
.list-common-empty-tip { |
|||
margin-top: 36rpx; |
|||
font-weight: 500; |
|||
font-size: 32rpx; |
|||
color: #000000; |
|||
} |
|||
|
|||
.com-flex-tao { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.search-box { |
|||
width: 697rpx; |
|||
height: 67rpx; |
|||
background: #f2f2f2; |
|||
border-radius: 33rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 0 8rpx 0 28rpx; |
|||
margin: 0 auto; |
|||
margin-bottom: 20rpx; |
|||
|
|||
.left { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
image { |
|||
width: 28rpx; |
|||
height: 30rpx; |
|||
} |
|||
|
|||
input { |
|||
margin-left: 20rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 400; |
|||
color: #333; |
|||
width: 450rpx; |
|||
} |
|||
} |
|||
|
|||
.btn { |
|||
width: 107rpx; |
|||
height: 53rpx; |
|||
background: #71B580; |
|||
border-radius: 27rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
line-height: 53rpx; |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.top-bg { |
|||
background: #fff; |
|||
padding-top: 20rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,89 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="nickname-box"> |
|||
<input v-model="nickname" type="text" placeholder="请输入内容" /> |
|||
</view> |
|||
<view class="btn" @click="save">保存</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "changeNickname", |
|||
data: function() { |
|||
return { |
|||
nickname: "" |
|||
} |
|||
}, |
|||
methods: { |
|||
save: function() { |
|||
if (!this.nickname) { |
|||
uni.showToast({ |
|||
title: '请输入昵称', |
|||
icon: 'none' |
|||
}) |
|||
return; |
|||
} |
|||
this.Post({ |
|||
nickname: this.nickname |
|||
}, '/api/uservice/user/profile').then(res => { |
|||
console.log(res) |
|||
if (res.code == 1) { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '保存成功！', |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.goBack() |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.bg { |
|||
min-height: 100vh; |
|||
padding-top: 50rpx; |
|||
} |
|||
|
|||
.nickname-box { |
|||
display: flex; |
|||
padding: 10rpx 0 30rpx; |
|||
margin: 0 30rpx; |
|||
align-items: center; |
|||
background: white; |
|||
margin-bottom: 100rpx; |
|||
font-size: 30rpx; |
|||
height: 70rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
} |
|||
|
|||
.nickname-box span { |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.nickname-box input { |
|||
flex: 1; |
|||
font-size: 30rpx; |
|||
display: block; |
|||
} |
|||
|
|||
.btn { |
|||
color: black; |
|||
margin: 0 auto; |
|||
line-height: 80rpx; |
|||
position: relative; |
|||
font-size: 34rpx; |
|||
text-align: center; |
|||
width: 333rpx; |
|||
height: 80rpx; |
|||
background: #6A8A2D; |
|||
border-radius: 40rpx; |
|||
color: #FFFFFF; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,494 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<!-- 导航栏 --> |
|||
<view class="nav-list"> |
|||
<view :class="['nav-item',{active:index==navActive}]" v-for="(item,index) in navList" :key="index" |
|||
@click="changeNav(index)">{{ item.name }} |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 列表 --> |
|||
<view class="coupon-list" v-if="coupon.length>0"> |
|||
<view :class="['coupon-item',{'hasUse':navActive!=0}]" v-for="(item, index) in coupon" :key="index"> |
|||
<!-- 分割线上部分 --> |
|||
<view class="item-top"> |
|||
<view class="top-left"> |
|||
<view class="price price-before" v-if="item.activity.discount_type == 'pricebreak'"> |
|||
<span>{{(item.activity.money) / 100}}</span> |
|||
</view> |
|||
<view class="price" v-else> |
|||
<span>{{item.activity.fold}}</span>折 |
|||
</view> |
|||
<view class="subtitle"> |
|||
满{{item.activity.mini_money/100}}元可用 |
|||
</view> |
|||
</view> |
|||
<view class="top-right"> |
|||
<view class="title text-overflowRows"> |
|||
{{item.activity.name}} |
|||
</view> |
|||
<view class="time"> |
|||
{{item.get_date.slice(0,10)}}-{{item.end_time.slice(0,10)}}可用 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- 分割线 --> |
|||
<view class="item-circle"> |
|||
<view class="circle left"></view> |
|||
<view class="line"></view> |
|||
<view class="circle right"></view> |
|||
</view> |
|||
<!-- 分割线下部分 --> |
|||
<view class="item-bottom"> |
|||
<view class="rules" @click="changeRules(item,index)"> |
|||
<span v-if="!item.openRules">使用规则：{{item.note}}</span> |
|||
<view class="open" v-else>使用规则：{{item.note}}</view> |
|||
<!-- <span v-if="!item.openRules">使用规则：{{item.content}}</span> |
|||
<view class="open" v-else>使用规则：{{item.content}}</view> --> |
|||
<image v-if="!item.openRules" src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/6a7630c176f976bb16674dde482779fb.png" mode=""></image> |
|||
<image v-else src="https://yjks.oss-cn-shanghai.aliyuncs.com/uploads/20230415/f0073b18b3ab88cac62de60411360fc1.png" mode=""></image> |
|||
</view> |
|||
<!-- <view class="use" @click="use" v-if="navActive==0"> |
|||
去使用 |
|||
</view> |
|||
<view class="use" v-else> |
|||
已失效 |
|||
</view> --> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-else class="noCoupon"> |
|||
<img src="https://static.ticket.sz-trip.com/tongli/images/user/couponNo.png" class="no-couPon"> |
|||
<view>暂无优惠券</view> |
|||
</view> |
|||
|
|||
<!-- 兑换优惠券 --> |
|||
<!-- <view class="duihuan" @click="open"> |
|||
兑换优惠券 > |
|||
</view> --> |
|||
<!-- 弹框 --> |
|||
<uni-popup ref="popup" type="center"> |
|||
<view class="popupBox"> |
|||
<view class="name"> |
|||
兑换优惠券 |
|||
</view> |
|||
<input type="text" v-model="password" placeholder="请输入兑换码"> |
|||
<view class="btns"> |
|||
<view class="cancel" @click="cancel"> |
|||
取消 |
|||
</view> |
|||
<span></span> |
|||
<view class="sub" @click="submitPassword"> |
|||
兑换 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
navList: [ |
|||
{name: '可使用', status:1}, |
|||
{name: '已失效', status:3}, |
|||
], |
|||
navActive:'', // 当前导航 |
|||
coupon:[], |
|||
// openRules: false, |
|||
password:'' |
|||
} |
|||
}, |
|||
onShow() { |
|||
this.getList(this.navList[0]) |
|||
}, |
|||
methods: { |
|||
getPecenet:function (percent) { |
|||
if(percent>=100 || percent<=0) return ""; |
|||
percent = 100 - percent; |
|||
if(percent%10==0){ |
|||
percent = percent/10; |
|||
} |
|||
return percent |
|||
}, |
|||
use() { |
|||
uni.switchTab({ |
|||
url: "/pages/index/index", |
|||
}); |
|||
}, |
|||
submitPassword() { |
|||
console.log('提交的兑换码',this.password); |
|||
let that = this |
|||
that.password = that.password.trim() |
|||
that.$refs.popup.close() |
|||
if (that.password== '') { |
|||
uni.showToast({ |
|||
title: '请输入优惠券领取卡号', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
that.Post({ |
|||
card_key: that.password |
|||
}, "/api/coupon/getCoupon").then((res) => { |
|||
console.log(res.code); |
|||
if (res.code == 200) { |
|||
that.coupon = [] |
|||
this.getList(this.navList[0]) |
|||
uni.showToast({ |
|||
title: '兑换成功', |
|||
icon: 'none' |
|||
}) |
|||
} else{ |
|||
uni.showToast({ |
|||
title: res.msg, |
|||
icon: 'none' |
|||
}) |
|||
} |
|||
}); |
|||
that.password = '' |
|||
}, |
|||
cancel() { |
|||
this.password = '' |
|||
this.$refs.popup.close() |
|||
}, |
|||
open() { |
|||
this.$refs.popup.open('center') |
|||
}, |
|||
// 打开使用规则 |
|||
changeRules(item,index){ |
|||
let list = this.coupon |
|||
list.forEach((Item, Index) => { |
|||
if (Index === index) { |
|||
Item.openRules = !Item.openRules |
|||
} else { |
|||
Item.openRules = false |
|||
} |
|||
}) |
|||
this.coupon = list |
|||
this.$forceUpdate() |
|||
}, |
|||
// 处理价格 |
|||
showNoPriceNew(price) { |
|||
if (price && price > 0) { |
|||
return (price / 100) |
|||
} else { |
|||
return '0' |
|||
} |
|||
}, |
|||
// 切换导航 |
|||
changeNav(index){ |
|||
this.navActive=index |
|||
this.getList(this.navList[this.navActive]) |
|||
}, |
|||
// 获取优惠券列表 |
|||
getList(item) { |
|||
let that = this |
|||
that.Post({ |
|||
status: item.status, |
|||
offset: 0, |
|||
limit: 100, |
|||
}, "/api/coupon/get_user_list").then((res) => { |
|||
if (res) { |
|||
console.log(res.data); |
|||
that.coupon = res.data |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
background: #F7F7F7; |
|||
min-height: 100vh; |
|||
} |
|||
|
|||
/*导航*/ |
|||
.nav-list { |
|||
width: 100%; |
|||
height: 107rpx; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
position: fixed; |
|||
background: #FFFFFF; |
|||
} |
|||
|
|||
.nav-list .nav-item { |
|||
text-align: center; |
|||
line-height: 106rpx; |
|||
box-sizing: border-box; |
|||
font-size: 31rpx; |
|||
font-weight: bold; |
|||
padding: .23rpx 0; |
|||
color: #333333; |
|||
} |
|||
|
|||
.nav-list .nav-item.active { |
|||
color: #000000; |
|||
border-bottom: 7rpx solid #6A8A27; |
|||
} |
|||
|
|||
.coupon-list{ |
|||
/* width: 100%; */ |
|||
position: absolute; |
|||
top: 115rpx; |
|||
padding: 0 26.67rpx; |
|||
background: #F7F7F7; |
|||
min-height: 100vh; |
|||
padding-bottom: 30rpx; |
|||
} |
|||
|
|||
.coupon-list .coupon-item { |
|||
width: 697rpx; |
|||
background: #ffffff; |
|||
margin-top: 20rpx; |
|||
border-radius: 13rpx; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-top { |
|||
display: flex; |
|||
padding: 30rpx 16rpx 24rpx 36rpx; |
|||
align-items: center; |
|||
} |
|||
|
|||
.coupon-item .item-top .price { |
|||
font-size: 25rpx; |
|||
font-weight: bold; |
|||
color: #6A8A27; |
|||
display: flex; |
|||
align-items: baseline; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.coupon-item .item-top .price span { |
|||
font-size: 60rpx; |
|||
margin-right: 6.67rpx; |
|||
} |
|||
|
|||
.top-left .subtitle { |
|||
width: 100%; |
|||
font-size: 24rpx; |
|||
color: #6A8A27; |
|||
padding-left: 6rpx; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
.top-left .price-before::before{ |
|||
content: '￥'; |
|||
font-size: 32rpx; |
|||
} |
|||
|
|||
.top-right { |
|||
margin-left: 46.67rpx; |
|||
font-size: 25rpx; |
|||
font-weight: 500; |
|||
color: #111; |
|||
} |
|||
|
|||
.top-right .title { |
|||
margin-bottom: 26rpx; |
|||
font-size: 31rpx; |
|||
font-weight: bold; |
|||
width: 100%; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-circle { |
|||
/* position: relative; */ |
|||
line-height: 1rpx; |
|||
height: 1rpx; |
|||
width: 692rpx; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-circle .line { |
|||
border-bottom: 1px dashed #ccc; |
|||
/* position: absolute; */ |
|||
top: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
/* width: calc(100% - 1rem); */ |
|||
height: .1rpx; |
|||
margin: auto; |
|||
z-index: 9; |
|||
} |
|||
|
|||
.coupon-list .coupon-item .item-circle .circle { |
|||
position: absolute; |
|||
top: 0; |
|||
bottom: 0; |
|||
margin: auto; |
|||
border-radius: 50%; |
|||
background: #ccc; |
|||
width: .46rpx; |
|||
height: .46rpx; |
|||
z-index: 10; |
|||
} |
|||
.coupon-list .coupon-item .item-circle .circle.left{ |
|||
left:-.23rpx; |
|||
} |
|||
.coupon-list .coupon-item .item-circle .circle.right{ |
|||
right: -.23rpx; |
|||
} |
|||
|
|||
.item-bottom { |
|||
padding: 16rpx 20rpx; |
|||
display: flex; |
|||
align-items: flex-start; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.item-bottom .rules { |
|||
font-size: 24rpx; |
|||
font-weight: 500; |
|||
color: #999; |
|||
display: flex; |
|||
line-height: 47rpx; |
|||
} |
|||
|
|||
.item-bottom .rules span { |
|||
width: 569rpx; |
|||
overflow: hidden; //超出隐藏 |
|||
white-space: nowrap; //不折行 |
|||
text-overflow: ellipsis; |
|||
} |
|||
|
|||
.item-bottom .rules image { |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 68rpx; |
|||
margin-top: 15rpx; |
|||
} |
|||
|
|||
.item-bottom .use { |
|||
width: 133rpx; |
|||
height: 47rpx; |
|||
border: 1px solid #FC5209; |
|||
border-radius: 23rpx; |
|||
text-align: center; |
|||
font-size: 25rpx; |
|||
font-weight: 500; |
|||
color: #fc5209; |
|||
line-height: 47rpx; |
|||
} |
|||
|
|||
.open { |
|||
width: 569rpx; |
|||
min-height: 30rpx; |
|||
flex-wrap: wrap; |
|||
} |
|||
|
|||
.duihuan { |
|||
width: 293rpx; |
|||
height: 67rpx; |
|||
background: #fff; |
|||
box-shadow: 0rpx 0rpx 7rpx 0rpx rgba(153,153,153,0.18); |
|||
border-radius: 33rpx; |
|||
font-size: 31rpx; |
|||
font-weight: 500; |
|||
color: #07C49B; |
|||
text-align: center; |
|||
line-height: 67rpx; |
|||
margin-left: 228.67rpx; |
|||
position: fixed; |
|||
bottom: 52.67rpx; |
|||
} |
|||
.top-left { |
|||
width: 140rpx; |
|||
} |
|||
.top-left .price { |
|||
width: 100%; |
|||
/* overflow: hidden; */ |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
.popupBox { |
|||
background: #fff; |
|||
border-radius: 20rpx; |
|||
padding: 40.67rpx 39.33rpx 35.33rpx 40rpx; |
|||
} |
|||
|
|||
.popupBox .name { |
|||
font-size: 35rpx; |
|||
color: #111; |
|||
font-weight: bold; |
|||
margin-bottom: 57.33rpx; |
|||
text-align: center; |
|||
} |
|||
|
|||
.popupBox input { |
|||
width: 454rpx; |
|||
height: 81rpx; |
|||
border: 1px solid #D8D8D8; |
|||
border-radius: 7rpx; |
|||
font-size: 31rpx;font-weight: 500; |
|||
color: #999999; |
|||
line-height: 81rpx; |
|||
margin: 0 39.33rpx 72.67rpx 40rpx; |
|||
text-align: center; |
|||
} |
|||
|
|||
.popupBox .btns { |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 35rpx; |
|||
justify-content: space-around; |
|||
} |
|||
|
|||
.popupBox .btns .cancel { |
|||
color: #111; |
|||
} |
|||
|
|||
.popupBox .btns span { |
|||
width: 1rpx; |
|||
height: 53rpx; |
|||
background: #D8D8D8; |
|||
} |
|||
|
|||
.popupBox .btns .sub { |
|||
color: #07C49B; |
|||
} |
|||
|
|||
.hasUse { |
|||
color: #999 !important; |
|||
} |
|||
.hasUse .item-top .top-left .price{ |
|||
color: #999 !important; |
|||
} |
|||
.hasUse .item-top .top-left .subtitle{ |
|||
color: #999 !important; |
|||
} |
|||
.hasUse .item-top .top-right .title { |
|||
color: #999 !important; |
|||
} |
|||
.hasUse .item-top .top-right .time { |
|||
color: #999 !important; |
|||
} |
|||
.hasUse .item-bottom .use { |
|||
border: 1px solid #B3B3B3 !important; |
|||
color: #999999 !important; |
|||
} |
|||
|
|||
.noCoupon{ |
|||
padding-top: 524rpx; |
|||
text-align: center; |
|||
font-size: 31rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
|
|||
.no-couPon{ |
|||
width: 173rpx; |
|||
height: 173rpx; |
|||
margin-bottom: 15rpx; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,168 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<image src="https://static.ticket.sz-trip.com/tongli/images/user/logout.png" class="logoutImg"></image> |
|||
<view class="title">用户注销协议</view> |
|||
<view class="text" v-html="formateRichText(content)"></view> |
|||
|
|||
<footer> |
|||
<view> |
|||
<view class="dui-box" :style="{backgroundImage: isTrue ? 'url(https://static.ticket.sz-trip.com/shiweisuzhou/images/user/logoutDui.png)' : '', |
|||
border: isTrue ? '' : '1rpx solid #515150'}" |
|||
@click="isTrue = !isTrue"></view> |
|||
您已经同意《用户注销协议》 |
|||
</view> |
|||
|
|||
<view class="flex-between"> |
|||
<view class="btn flex-center" @click="goBack">取消</view> |
|||
<view class="btn flex-center" v-if="time != 0">查看协议({{time}}s)</view> |
|||
<view class="btn btns flex-center" v-else @click="confirmLogout">确认注销</view> |
|||
</view> |
|||
</footer> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
content: '', |
|||
isTrue: false, |
|||
time: 8 |
|||
} |
|||
}, |
|||
onShow() { |
|||
// this.Post({ |
|||
// id: 10274 |
|||
// },'/api/article/getArticleById').then(res => { |
|||
// if(res.code == 1) { |
|||
// this.content = res.data.content |
|||
// var countdown = setInterval(() => { |
|||
// this.time -- |
|||
// if(this.time == 0) { |
|||
// clearInterval(countdown) |
|||
// } |
|||
// },1000) |
|||
// } |
|||
// }) |
|||
var countdown = setInterval(() => { |
|||
this.time -- |
|||
if(this.time == 0) { |
|||
clearInterval(countdown) |
|||
} |
|||
},1000) |
|||
}, |
|||
methods: { |
|||
confirmLogout() { |
|||
if(!this.isTrue) { |
|||
uni.showToast({ |
|||
title: '请先同意协议', |
|||
icon: 'none' |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '确认注销账号？', |
|||
success: successRes => { |
|||
if (successRes.confirm) { |
|||
this.Post({ |
|||
protocol: 1 |
|||
},'/api/uservice/user/user_logout').then(res => { |
|||
if(res.code == 1) { |
|||
uni.showToast({ |
|||
title: '注销成功', |
|||
icon: 'none' |
|||
}) |
|||
this.$store.commit('changeUserInfo', {}) |
|||
setTimeout(() => { |
|||
uni.switchTab({ |
|||
url: '/pages/index/index' |
|||
}) |
|||
},1000) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
min-height: 100vh; |
|||
background-color: #fff; |
|||
padding: 88rpx 0 250rpx; |
|||
} |
|||
|
|||
.logoutImg { |
|||
display: block; |
|||
width: 120rpx; |
|||
height: 120rpx; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.title { |
|||
font-weight: bold; |
|||
font-size: 40rpx; |
|||
color: #000000; |
|||
margin: 60rpx auto 50rpx; |
|||
text-align: center; |
|||
} |
|||
|
|||
.text { |
|||
padding: 0 40rpx; |
|||
} |
|||
|
|||
footer { |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 0; |
|||
padding: 0 68rpx; |
|||
width: 100%; |
|||
|
|||
.dui-box { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin-right: 19rpx; |
|||
background-size: 100% 100%; |
|||
border-radius: 50%; |
|||
} |
|||
|
|||
&>view:first-child { |
|||
display: flex; |
|||
align-items: center; |
|||
font-weight: 500; |
|||
font-size: 24rpx; |
|||
color: #000000; |
|||
} |
|||
|
|||
&>view:last-child { |
|||
margin: 53rpx 0 67rpx; |
|||
|
|||
.btn { |
|||
width: 267rpx; |
|||
height: 80rpx; |
|||
background: #BFBFBF; |
|||
border-radius: 11rpx; |
|||
font-weight: 500; |
|||
font-size: 36rpx; |
|||
color: #FFFFFF; |
|||
} |
|||
|
|||
&>view:nth-child(1) { |
|||
border: 3rpx solid #6A8A27; |
|||
font-weight: 500; |
|||
color: #6A8A27; |
|||
background: #fff; |
|||
} |
|||
|
|||
.btns { |
|||
background: #6A8A27; |
|||
color: #FFFFFF; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,417 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="list-forms"> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">姓名:</view> |
|||
<view class="list-item-input"><input type="text" v-model="username" placeholder="请输入姓名" /></view> |
|||
</view> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">手机号:</view> |
|||
<view class="list-item-input"><input type="number" v-model="mobile" placeholder="请输入手机号" maxlength="11" |
|||
/></view> |
|||
</view> |
|||
<view class="list-item" style="position: relative;"> |
|||
<view class="list-item-title">选择地区:</view> |
|||
<view class="list-item-input" style="flex: 1;"> |
|||
<picker mode="multiSelector" :range="newProvinceDataList" range-key="name" @change="changeArea" @columnchange="pickerColumnchange" |
|||
style="position: relative;z-index: 2;"> |
|||
<input type="text" readonly style="text-align: right;font-size: 33rpx;position: relative;z-index: -1;" |
|||
v-model="citySeld" disabled="true" placeholder="请选择地区"/> |
|||
</picker> |
|||
</view> |
|||
</view> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">详细地址:</view> |
|||
<view class="list-item-input"><input type="text" v-model="detailAddr" placeholder="请输入详细地址" /></view> |
|||
</view> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">设为默认:</view> |
|||
<view class="list-item-switch"> |
|||
<switch :checked="idDefault" @change="switchChange" color="#6A8A2D"/> |
|||
</view> |
|||
</view> |
|||
<view class="list-item-btn"> |
|||
<view class="list-item-post" @click="postSave()">保存</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import District from 'ydui-district/dist/jd_province_city_area_id'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
username: '', |
|||
mobile: '', |
|||
citySeld: '', |
|||
detailAddr: '', |
|||
idDefault: false, |
|||
title: '新增收货地址', |
|||
show: false, |
|||
district: District, //数据 |
|||
ready: false, |
|||
province: null, |
|||
city: null, |
|||
area: '', |
|||
provinceId: null, |
|||
cityId: null, |
|||
areaId: null, |
|||
columns: [], |
|||
id: '', |
|||
newProvinceDataList:[ |
|||
[],[],[] |
|||
], |
|||
multiIndex: [0, 0, 0], |
|||
} |
|||
}, |
|||
onLoad(option){ |
|||
this.id = option.id |
|||
if (option.id > 0) { |
|||
this.title = '编辑收货地址' |
|||
this.getDetail() |
|||
} |
|||
else { |
|||
this.getSeldCityList() |
|||
} |
|||
}, |
|||
methods: { |
|||
switchChange(e){ |
|||
this.idDefault = e.detail.value |
|||
}, |
|||
changeArea(e){ |
|||
// 数组内的下标 |
|||
this.multiIndex = e.detail.value; |
|||
this.citySeld = this.newProvinceDataList[0][this.multiIndex[0]].name + this.newProvinceDataList[1][this.multiIndex[1]].name + this.newProvinceDataList[2][this.multiIndex[2]].name |
|||
this.provinceId = this.newProvinceDataList[0][this.multiIndex[0]].id |
|||
this.cityId = this.newProvinceDataList[1][this.multiIndex[1]].id |
|||
this.areaId = this.newProvinceDataList[2][this.multiIndex[2]].id |
|||
}, |
|||
getSeldCityList() { |
|||
let that = this; |
|||
that.Post({}, '/api/uservice/user/getAreas').then(res => { |
|||
if (res.code === 1) { |
|||
var data = res.data; |
|||
var result = {}; |
|||
|
|||
// 处理数据，构建省市区的层级结构 |
|||
for (var i = 0; i < data.length; i++) { |
|||
var item = data[i]; |
|||
if (item.level === 0) { |
|||
continue; // 跳过国家层级 |
|||
} |
|||
if (item.level === 1) { |
|||
// 处理省份 |
|||
result[item.id.toString()] = { |
|||
id: item.id, |
|||
name: item.name, |
|||
children: [] |
|||
}; |
|||
} else if (item.level === 2) { |
|||
// 处理城市 |
|||
var provinceId = item.pid.toString(); |
|||
if (result[provinceId]) { |
|||
result[provinceId].children.push({ |
|||
id: item.id, |
|||
name: item.name, |
|||
children: [] |
|||
}); |
|||
} |
|||
} else if (item.level === 3) { |
|||
// 处理区域 |
|||
var cityId = item.pid.toString(); |
|||
for (var j = 0; j < Object.keys(result).length; j++) { |
|||
var province = result[Object.keys(result)[j]]; |
|||
for (var k = 0; k < province.children.length; k++) { |
|||
var city = province.children[k]; |
|||
if (city.id.toString() === cityId) { |
|||
city.children.push({ |
|||
id: item.id, |
|||
name: item.name |
|||
}); |
|||
break; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
// 将 Object 转为 Array |
|||
var r = []; |
|||
for (var i in result) { |
|||
r.push(result[i]); |
|||
} |
|||
|
|||
// 将数据赋值给省市区联动选择器 |
|||
that.district = r; |
|||
|
|||
// 初始化省市区数据 |
|||
let arr = []; |
|||
let arr1 = []; |
|||
let arr2 = []; |
|||
|
|||
that.district.forEach(item => { |
|||
arr.push(item); |
|||
}); |
|||
|
|||
if (that.district.length > 0 && that.district[0].children.length > 0) { |
|||
that.district[0].children.forEach(item => { |
|||
arr1.push(item); |
|||
}); |
|||
|
|||
if (that.district[0].children[0].children.length > 0) { |
|||
that.district[0].children[0].children.forEach(item => { |
|||
arr2.push(item); |
|||
}); |
|||
} |
|||
} |
|||
|
|||
that.columns = arr; |
|||
// 控制异步数据 |
|||
that.ready = true; |
|||
|
|||
// 填充 newProvinceDataList |
|||
that.newProvinceDataList[0] = []; |
|||
that.newProvinceDataList[1] = []; |
|||
that.newProvinceDataList[2] = []; |
|||
|
|||
for (let i = 0; i < that.columns.length; i++) { |
|||
that.newProvinceDataList[0].push({ name: that.columns[i].name, id: that.columns[i].id }); |
|||
} |
|||
|
|||
if (that.columns.length > 0 && that.columns[0].children.length > 0) { |
|||
for (let i = 0; i < that.columns[0].children.length; i++) { |
|||
that.newProvinceDataList[1].push({ name: that.columns[0].children[i].name, id: that.columns[0].children[i].id }); |
|||
} |
|||
|
|||
if (that.columns[0].children[0].children.length > 0) { |
|||
for (let i = 0; i < that.columns[0].children[0].children.length; i++) { |
|||
that.newProvinceDataList[2].push({ name: that.columns[0].children[0].children[i].name, id: that.columns[0].children[0].children[i].id }); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
// 滑动 |
|||
pickerColumnchange(e){ |
|||
// 第几列滑动 |
|||
// console.log(e.detail.column); |
|||
// 第几列滑动的下标 |
|||
// console.log(e.detail.value) |
|||
// 第一列滑动 |
|||
if(e.detail.column === 0){ |
|||
this.multiIndex[0] = e.detail.value |
|||
// console.log('第一列滑动'); |
|||
// this.newProvinceDataList[1] = []; |
|||
this.newProvinceDataList[1] = this.columns[this.multiIndex[0]].children.map((item,index)=>{ |
|||
// console.log(item) |
|||
return item |
|||
}) |
|||
// console.log(this.multiIndex) |
|||
if(this.columns[this.multiIndex[0]].children.length === 1){ |
|||
this.newProvinceDataList[2] = this.columns[this.multiIndex[0]].children[0].children.map((item,index)=>{ |
|||
// console.log(item) |
|||
return item |
|||
}) |
|||
}else{ |
|||
this.newProvinceDataList[2] = this.columns[this.multiIndex[0]].children[this.multiIndex[1]].children.map((item,index)=>{ |
|||
// console.log(item) |
|||
return item |
|||
}) |
|||
} |
|||
// 第一列滑动 第二列 和第三列 都变为第一个 |
|||
this.multiIndex.splice(1, 1, 0) |
|||
this.multiIndex.splice(2, 1, 0) |
|||
} |
|||
// 第二列滑动 |
|||
if(e.detail.column === 1){ |
|||
this.multiIndex[1] = e.detail.value |
|||
// console.log('第二列滑动'); |
|||
// console.log(this.multiIndex) |
|||
this.newProvinceDataList[2] = this.columns[this.multiIndex[0]].children[this.multiIndex[1]].children.map((item,index)=>{ |
|||
// console.log(item) |
|||
return item |
|||
}) |
|||
// 第二列 滑动 第三列 变成第一个 |
|||
this.multiIndex.splice(2, 1, 0) |
|||
} |
|||
// 第三列滑动 |
|||
if(e.detail.column === 2){ |
|||
this.multiIndex[2] = e.detail.value |
|||
// console.log('第三列滑动') |
|||
// console.log(this.multiIndex) |
|||
} |
|||
}, |
|||
getDetail() { |
|||
this.Post({ |
|||
id: this.id |
|||
}, "/api/uservice/user/getContactInfoById").then(res => { |
|||
res = res.data; |
|||
if (res && res.id > 0) { |
|||
this.username = res.name |
|||
this.mobile = res.tel |
|||
this.idDefault = res.is_default == 1 ? true : false |
|||
this.provinceId = res.province_id |
|||
this.cityId = res.city_id |
|||
this.areaId = res.district_id |
|||
this.citySeld = res.seldAdd |
|||
this.detailAddr = res.detail_addr; |
|||
this.getSeldCityList(); |
|||
} |
|||
}) |
|||
}, |
|||
postSave() { |
|||
this.username = this.username.trim() |
|||
this.mobile = this.mobile.trim() |
|||
this.detailAddr = this.detailAddr.trim() |
|||
if (this.username.length < 1) { |
|||
uni.showToast({ |
|||
title: '请输入姓名', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (this.username.length > 6) { |
|||
uni.showToast({ |
|||
title: '姓名最多6个字', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (!this.IsTel(this.mobile)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的手机号', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (this.citySeld.length < 1) { |
|||
uni.showToast({ |
|||
title: '请选择地区', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (this.detailAddr.length < 2) { |
|||
uni.showToast({ |
|||
title: '请输入具体地址', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
this.Post({ |
|||
username: this.username, |
|||
mobile: this.mobile, |
|||
is_default: this.idDefault ? '1' : '0', |
|||
province_id: this.provinceId, |
|||
city_id: this.cityId, |
|||
district_id: this.areaId, |
|||
detail_addr: this.detailAddr, |
|||
id: this.id || null |
|||
},'/api/uservice/user/' + (this.id > 0 ? 'edit' : 'add') + 'Consignee').then(res => { |
|||
if(res.code == 1){ |
|||
uni.setStorageSync('addressNow',JSON.stringify(res.data)) |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: this.id>0?'编辑成功':'添加成功', |
|||
showCancel: false, |
|||
success: res => { |
|||
if(res.confirm){ |
|||
uni.navigateBack({}) |
|||
} |
|||
} |
|||
}) |
|||
}else{ |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
|
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.bg { |
|||
min-height: 100vh; |
|||
background-color: white; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.list-forms { |
|||
display: flex; |
|||
flex-direction: column; |
|||
border-top: 1rpx solid #D8D8D8; |
|||
padding: 20rpx 40rpx; |
|||
box-sizing: content-box |
|||
} |
|||
|
|||
.list-item { |
|||
display: flex; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 30rpx 0; |
|||
height: 60rpx; |
|||
align-items: center; |
|||
box-sizing: content-box |
|||
} |
|||
|
|||
.list-item-title { |
|||
width: 150rpx; |
|||
font-size: 31rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
|
|||
.list-item-input { |
|||
flex: 1; |
|||
} |
|||
|
|||
.list-item-input input { |
|||
width: 100%; |
|||
height: 100%; |
|||
padding: 0; |
|||
margin: 0; |
|||
border: 0; |
|||
background-color: transparent; |
|||
line-height: 34rpx; |
|||
font-size: 31rpx; |
|||
text-align: right; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.list-item-input input::placeholder { |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
.list-item-switch { |
|||
display: flex; |
|||
flex: 1; |
|||
justify-content: flex-end; |
|||
} |
|||
|
|||
.list-item-btn { |
|||
display: flex; |
|||
justify-content: center; |
|||
margin-top: 20rpx; |
|||
} |
|||
|
|||
.list-item-post { |
|||
display: flex; |
|||
color: #FFFFFF; |
|||
font-size: 36rpx; |
|||
width: 697rpx; |
|||
height: 73rpx; |
|||
background: #6A8A2D; |
|||
border-radius: 37rpx; |
|||
justify-content: center; |
|||
align-items: center; |
|||
margin-top: 650rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,272 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="list-forms"> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">姓名</view> |
|||
<view class="list-item-input"><input type="text" v-model="username" placeholder="请输入姓名" /></view> |
|||
</view> |
|||
<!-- <view class="list-item"> |
|||
<picker mode="selector" :range="idcardTypeList" range-key="title" @change="changeIdType"> |
|||
<view class="list-item-title flex-center" |
|||
style="border: 1rpx solid #999999;border-radius: 7rpx;padding: 18rpx 19rpx;">{{idcardTypeValue}} |
|||
<image src="https://static.ticket.sz-trip.com/yandu/images/user/dui.png" mode="" |
|||
style="width: 40rpx;height: 40rpx;margin-left: 48rpx;"></image> |
|||
</view> |
|||
</picker> |
|||
<view class="list-item-input"><input type="text" v-model="idNumber" placeholder="请输入正确的证件号" /></view> |
|||
</view> --> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">手机号</view> |
|||
<view class="list-item-input"><input type="number" v-model="mobile" placeholder="请输入手机号" |
|||
maxlength="11" /></view> |
|||
</view> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">身份证号</view> |
|||
<view class="list-item-input"><input type="text" v-model="idNumber" placeholder="请输入正确的证件号" /></view> |
|||
</view> |
|||
<view class="list-item"> |
|||
<view class="list-item-title">设为默认</view> |
|||
<view class="list-item-switch"> |
|||
<switch :checked="idDefault" @change="switchChange" color="#6A8A2D"/> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btn" @click="submit">保存</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
username: '', |
|||
mobile: '', |
|||
idNumber: '', |
|||
idcardTypeValue: '身份证', |
|||
show: false, |
|||
idcardTypeList: [], |
|||
document_type: 'DAM01001', |
|||
idCardType: 1, |
|||
id: '', |
|||
type: '', |
|||
idDefault: false, |
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
if (option) { |
|||
this.id = option.id |
|||
} |
|||
if(option && option.type){ |
|||
this.type = option.type |
|||
} |
|||
}, |
|||
onShow() { |
|||
this.getIdcardTypeList() |
|||
if (this.id) { |
|||
this.getDetail() |
|||
} |
|||
// uni.setNavigationBarTitle({ |
|||
// title: '' |
|||
// }) |
|||
var pages = getCurrentPages();//获取页面 |
|||
var beforePage = pages[pages.length - 2];//上个页面 |
|||
// if(beforePage.route == 'subPackages/scenic/scenicOrder' || beforePage.route == 'subPackages/venue/venueOrder'){ |
|||
// uni.setStorageSync('route', 1) |
|||
// } |
|||
}, |
|||
methods: { |
|||
switchChange(e){ |
|||
this.idDefault = e.detail.value |
|||
}, |
|||
getDetail() { |
|||
this.Post({ |
|||
id: this.id |
|||
}, '/api/uservice/user/getContactInfoById').then(res => { |
|||
if (res.code === 1) { |
|||
res = res.data |
|||
if (res && res.id > 0) { |
|||
this.username = res.name |
|||
this.mobile = res.tel |
|||
this.idNumber = res.id_number |
|||
this.idDefault = res.is_default == 1 ? true : false |
|||
this.idcardType = res.idcard_type |
|||
this.idcardTypeValue = res.document_type_text |
|||
this.document_type = res.document_type |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
//获取证件类型 |
|||
getIdcardTypeList() { |
|||
this.Post({}, '/api/uservice/user/getCardTypeList').then(res => { |
|||
this.idcardTypeList = res.data |
|||
}) |
|||
}, |
|||
// 选择证件类型 |
|||
changeIdType(e) { |
|||
this.idcardTypeValue = this.idcardTypeList[e.detail.value].title |
|||
this.document_type = this.idcardTypeList[e.detail.value].code |
|||
this.idCardType = this.idcardTypeList[e.detail.value].type |
|||
}, |
|||
// 提交 |
|||
submit() { |
|||
this.username = this.username.trim() |
|||
this.mobile = this.mobile.trim() |
|||
this.idNumber = this.idNumber.trim() |
|||
if (this.username.length < 1) { |
|||
uni.showToast({ |
|||
title: '请输入姓名', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (!this.IsTel(this.mobile)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的手机号', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
if (this.idcardTypeValue == '身份证') { |
|||
if (!this.idCardNumber(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的身份证', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} else if (this.idcardTypeValue == '护照') { |
|||
if (!this.passportValid(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的护照', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} else if (this.idcardTypeValue == '台胞证') { |
|||
if (!this.taiwanValid(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的台胞证', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} else if (this.idcardTypeValue == '港澳通行证') { |
|||
if (!this.gangaoValid(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的港澳通行证', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} else if (this.idcardTypeValue == '外国人永久居留证') { |
|||
if (!this.foreignerValid(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的外国人永久居留证', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} else if (this.idcardTypeValue == '军官证') { |
|||
if (!this.officerValid(this.idNumber)) { |
|||
uni.showToast({ |
|||
title: '请输入正确的军官证', |
|||
icon: 'none' |
|||
}) |
|||
return |
|||
} |
|||
} |
|||
this.Post({ |
|||
contactId: this.type == 'edit'?this.id:'', |
|||
id_number: this.idNumber, |
|||
username: this.username, |
|||
mobile: this.mobile, |
|||
document_type: this.document_type, |
|||
idcard_type: this.idCardType, |
|||
is_default: this.idDefault ? '1' : '0', |
|||
}, this.type=='edit'?'/api/uservice/user/editContactById':'/api/uservice/user/addNewContact').then(res => { |
|||
if (res.code == 1) { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '成功', |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
uni.navigateBack({}) |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.bg { |
|||
min-height: 100vh; |
|||
background-color: #FFFFFF; |
|||
position: relative; |
|||
} |
|||
|
|||
.list-forms { |
|||
padding: 0 33rpx; |
|||
|
|||
.list-item { |
|||
display: flex; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 30rpx 0; |
|||
height: 60rpx; |
|||
box-sizing: content-box; |
|||
align-items: center; |
|||
|
|||
.list-item-title { |
|||
font-size: 34rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
|
|||
.list-item-switch { |
|||
display: flex; |
|||
flex: 1; |
|||
justify-content: flex-end; |
|||
} |
|||
|
|||
.list-item-input { |
|||
flex: 1; |
|||
|
|||
input { |
|||
width: 100%; |
|||
height: 100%; |
|||
padding: 0; |
|||
margin: 0; |
|||
border: 0; |
|||
background-color: transparent; |
|||
line-height: 34rpx; |
|||
font-size: 31rpx; |
|||
text-align: right; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
input::placeholder { |
|||
font-size: 26rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btn { |
|||
width: 333rpx; |
|||
height: 80rpx; |
|||
background: #6A8A2D; |
|||
border-radius: 40rpx; |
|||
text-align: center; |
|||
line-height: 80rpx; |
|||
font-size: 36rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #FFFFFF; |
|||
margin: 271rpx auto 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,30 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="text" v-html="formateRichText(content)"> |
|||
|
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
content:'' |
|||
}; |
|||
}, |
|||
onLoad(option){ |
|||
this.Post({ |
|||
id:option.id |
|||
},'/api/pbservice/Other/getDictionary').then(res => { |
|||
this.content = res.data[0].content |
|||
}) |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.text{ |
|||
padding: 20rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,408 @@ |
|||
<template> |
|||
<view v-if="info"> |
|||
<view class="user-other-info"> |
|||
<div class="info-avatar-top"> |
|||
<span>头像</span> |
|||
<view @click="uploadImg()"> |
|||
<image :src="showImg(info.avatar)" mode="aspectFill" |
|||
style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image> |
|||
</view> |
|||
</div> |
|||
<navigator url="/subPackages/user/changeNickname" tag="view" class="userinfo-item"> |
|||
<span>姓名</span> |
|||
<view>{{nickname}}</view> |
|||
</navigator> |
|||
<view class="userinfo-item" @click="showSexSelect = true"> |
|||
<span>性别</span> |
|||
<view @click="$refs.popup.open()">{{gender == 1 ? '男' : (gender == 2 ? '女' : '保密')}}</view> |
|||
</view> |
|||
<view class="userinfo-item"> |
|||
<span>手机号</span> |
|||
<view>{{info.mobile}}</view> |
|||
</view> |
|||
<view class="userinfo-item"> |
|||
<span>生日</span> |
|||
<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange"> |
|||
<view class="uni-input">{{birthday}}</view> |
|||
</picker> |
|||
</view> |
|||
<navigator url="/subPackages/user/logout" tag="view" class="userinfo-item"> |
|||
<span>注销账号</span> |
|||
<i>注销后账号无法恢复，请谨慎操作</i> |
|||
</navigator> |
|||
<view class="btn-tao" @click="submit">保存</view> |
|||
</view> |
|||
|
|||
<!-- 性别弹框 --> |
|||
<uni-popup ref="popup" type="bottom"> |
|||
<view class="popup-box"> |
|||
<view class="popup-item flex-center" v-for="(item,index) in sexes" :key="index" @click="changesex(index)">{{item.text}}</view> |
|||
<view class="popup-items flex-center" @click="$refs.popup.close()">取消</view> |
|||
</view> |
|||
</uni-popup> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import {pathToBase64} from "@/static/js/mmmm-image-tools/index.js" |
|||
export default { |
|||
name: "Profile", |
|||
data() { |
|||
const currentDate = this.getDate({ |
|||
format: true |
|||
}) |
|||
return { |
|||
date: currentDate, |
|||
info: null, |
|||
showSexSelect: false, |
|||
sexes: [{ |
|||
value: '1', |
|||
text: '男' |
|||
}, |
|||
{ |
|||
value: '2', |
|||
text: '女' |
|||
}, |
|||
{ |
|||
value: '0', |
|||
text: '保密' |
|||
} |
|||
], |
|||
today: null, |
|||
showCropper: false, |
|||
nickname: '', |
|||
gender: '', |
|||
birthday: '', |
|||
email: '', |
|||
fileList1: [], |
|||
startDate: '1900-1-1', |
|||
endDate: '2050-1-1' |
|||
} |
|||
}, |
|||
onShow() { |
|||
console.log(this.$store.state.user.userInfo,uni.getStorageSync('userInfo')) |
|||
this.getList() |
|||
}, |
|||
computed: { |
|||
// startDate() { |
|||
// return this.getDate('start'); |
|||
// }, |
|||
// endDate() { |
|||
// return this.getDate('end'); |
|||
// } |
|||
}, |
|||
methods: { |
|||
getFile(e) { |
|||
console.log(e) |
|||
}, |
|||
getList() { |
|||
let today = new Date(); |
|||
today = today.getFullYear() + "/" + (today.getMonth() + 1) + "/" + today.getDate(); |
|||
this.today = today; |
|||
this.Post({}, "/api/uservice/user/getMyInfo").then(res => { |
|||
if (!res.data.birthday) { |
|||
let date = new Date(); |
|||
res.data.birthday = date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date |
|||
.getDate(); |
|||
} |
|||
this.info = res.data; |
|||
this.nickname = this.info.nickname |
|||
this.email = this.info.email |
|||
this.birthday = this.info.birthday |
|||
this.gender = this.info.gender |
|||
this.info.token = JSON.parse(uni.getStorageSync('userInfo')).token || this.$store.state.user.userInfo.token |
|||
console.log(this.info) |
|||
this.$store.commit('changeUserInfo', this.info) |
|||
}) |
|||
}, |
|||
uploadImg() { |
|||
uni.chooseImage({ |
|||
success: (chooseImageRes) => { |
|||
const tempFilePaths = chooseImageRes.tempFilePaths; |
|||
// // #ifdef MP-WEIXIN |
|||
// uni.getFileSystemManager().readFile({ |
|||
// filePath: tempFilePaths[0], |
|||
// encoding: 'base64', |
|||
// success: res => { |
|||
// this.Post({ |
|||
// method: 'POST', |
|||
// base64: 'data:image/png;base64,' + res.data |
|||
// }, '/api/common/base64').then(res => { |
|||
// if (res.data) { |
|||
// this.Post({ |
|||
// avatar: res.data |
|||
// }, '/api/uservice/user/profile').then(res => { |
|||
// uni.showModal({ |
|||
// title: '提示', |
|||
// content: res.msg, |
|||
// showCancel: false, |
|||
// success: res => { |
|||
// if (res.confirm) { |
|||
// this.getList() |
|||
// } |
|||
// } |
|||
// }) |
|||
// }) |
|||
// } |
|||
// }) |
|||
// } |
|||
// }) |
|||
// // #endif |
|||
|
|||
pathToBase64(tempFilePaths[0]).then(base64 => { |
|||
this.Post({ |
|||
method: 'POST', |
|||
base64: base64 |
|||
}, '/api/common/base64').then(res => { |
|||
if (res.data) { |
|||
this.Post({ |
|||
avatar: res.data |
|||
}, '/api/uservice/user/profile').then(res => { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.getList() |
|||
} |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
//生日 |
|||
bindDateChange: function(e) { |
|||
this.birthday = e.detail.value |
|||
}, |
|||
getDate(type) { |
|||
const date = new Date(); |
|||
let year = date.getFullYear(); |
|||
let month = date.getMonth() + 1; |
|||
let day = date.getDate(); |
|||
|
|||
if (type === 'start') { |
|||
year = year - 60; |
|||
} else if (type === 'end') { |
|||
year = year + 2; |
|||
} |
|||
month = month > 9 ? month : '0' + month; |
|||
day = day > 9 ? day : '0' + day; |
|||
return `${year}/${month}/${day}`; |
|||
}, |
|||
changesex(index) { |
|||
this.gender = this.sexes[index].value |
|||
this.$refs.popup.close() |
|||
}, |
|||
submit() { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '确认修改您的信息？', |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.Post({ |
|||
nickname: this.nickname, |
|||
gender: this.gender, |
|||
birthday: this.birthday |
|||
}, '/api/uservice/user/profile').then(res => { |
|||
console.log(res) |
|||
if (res.code == 1) { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.getList() |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
view { |
|||
box-sizing: content-box; |
|||
} |
|||
.info-avatar-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
font-size: 30rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 40rpx 0; |
|||
height: 48rpx; |
|||
color: #333; |
|||
align-items: center; |
|||
} |
|||
.info-avatar-top view{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.info-avatar-top view:after{ |
|||
content: ""; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 6rpx; |
|||
background-image: url('https://static.ticket.sz-trip.com/tongli/images/user/rightIcon-gray.png'); |
|||
background-size: 100% 100%; |
|||
} |
|||
.info-avatar-top img { |
|||
width: 80rpx; |
|||
height: 80rpx; |
|||
border-radius: 50%; |
|||
margin-right: 10rpx; |
|||
} |
|||
|
|||
.change-avatar-btn { |
|||
color: #FFF; |
|||
width: 220rpx; |
|||
margin: 0 auto; |
|||
line-height: 70rpx; |
|||
border-radius: 20rpx; |
|||
background: #4C93FF; |
|||
position: relative; |
|||
font-size: 34rpx; |
|||
} |
|||
|
|||
.change-avatar-btn input { |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
opacity: 0; |
|||
} |
|||
|
|||
.user-other-info { |
|||
margin: 30rpx; |
|||
} |
|||
|
|||
.userinfo-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 30rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 40rpx 30rpx 40rpx 0; |
|||
height: 48rpx; |
|||
color: #333; |
|||
position: relative; |
|||
} |
|||
|
|||
.info-avatar-top span { |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.userinfo-item span { |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
flex-shrink: 0; |
|||
color: #000; |
|||
} |
|||
|
|||
.userinfo-item i { |
|||
font-weight: 500; |
|||
font-size: 24rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.userinfo-item { |
|||
& view::after { |
|||
content: ""; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 6rpx; |
|||
background-image: url('https://static.ticket.sz-trip.com/tongli/images/user/rightIcon-gray.png'); |
|||
background-size: 100% 100%; |
|||
position: absolute; |
|||
right: 0; |
|||
margin: auto; |
|||
top: 0; |
|||
bottom: 0; |
|||
} |
|||
} |
|||
|
|||
.birthday-box { |
|||
text-align: right; |
|||
} |
|||
|
|||
.cropper { |
|||
width: auto; |
|||
height: 100%; |
|||
} |
|||
|
|||
.cropper-content { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
z-index: 1000; |
|||
} |
|||
|
|||
.dialog-footer .change-avatar-btn { |
|||
position: fixed; |
|||
text-align: center; |
|||
bottom: 80rpx; |
|||
left: 50%; |
|||
margin-left: -110rpx; |
|||
} |
|||
|
|||
.btn-tao { |
|||
text-align: center; |
|||
font-weight: 500; |
|||
font-size: 36rpx; |
|||
width: 697rpx; |
|||
height: 80rpx; |
|||
background: #6A8A27; |
|||
border-radius: 11rpx; |
|||
line-height: 80rpx; |
|||
color: #FFFFFF; |
|||
position: fixed; |
|||
left: 26rpx; |
|||
bottom: 100rpx; |
|||
} |
|||
|
|||
.popup-box { |
|||
border-radius: 20rpx 20rpx 0rpx 0rpx; |
|||
background: #fff; |
|||
overflow: hidden; |
|||
|
|||
.popup-item { |
|||
width: 697rpx; |
|||
height: 99rpx; |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
color: #12293C; |
|||
margin: auto; |
|||
} |
|||
.popup-item:nth-child(2) { |
|||
border: none; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
border-top: 1rpx solid #D8D8D8; |
|||
} |
|||
|
|||
.popup-items { |
|||
width: 100%; |
|||
height: 99rpx; |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
color: #12293C; |
|||
border-top: 13rpx solid #F2F2F2; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,357 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="cancat-nav flex-around"> |
|||
<view :class="['concat-nav-item',showType==0?'active':'']" @click="showType=0"> |
|||
<view>出行人信息</view> |
|||
<view v-if="showType==0" class="active-bar"></view> |
|||
</view> |
|||
<view :class="['concat-nav-item',showType==1?'active':'']" @click="showType=1"> |
|||
<view>收货地址</view> |
|||
<view v-if="showType==1" class="active-bar"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 出行人信息 --> |
|||
<view v-if="showType==0"> |
|||
<view class="item" v-for="(item,index) in travelList" :key="index"> |
|||
<view class="name"> |
|||
<view class=""> |
|||
{{item.name}} |
|||
</view> |
|||
<view class=""> |
|||
{{item.tel}} |
|||
<span v-if="item.is_default==1">默认</span> |
|||
</view> |
|||
</view> |
|||
<view class="idcard"> |
|||
<view class=""> |
|||
{{item.title}}: |
|||
</view> |
|||
<view class=""> |
|||
{{item.id_number}} |
|||
</view> |
|||
</view> |
|||
<view class="item-btn"> |
|||
<view class="choice"> |
|||
<!-- <image src="https://static.ticket.sz-trip.com/yandu/images/user/dui.png" mode="aspectFill" |
|||
v-if="item.is_default==1"> |
|||
</image> |
|||
<view class="yuan" v-else @click.stop="defaultC(item)"> |
|||
|
|||
</view> |
|||
<view class=""> |
|||
默认出行人 |
|||
</view> --> |
|||
</view> |
|||
<view class="btn-list"> |
|||
<view class="btn-item" @click.stop="edit(item.id)"> |
|||
修改 |
|||
</view> |
|||
<view class="btn-item" @click.stop="delet(item)"> |
|||
删除 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 收货地址 --> |
|||
<view v-else> |
|||
<view class="item" v-for="(item,index) in addressList" :key="index"> |
|||
<view class="name"> |
|||
<view> |
|||
{{item.name}} |
|||
</view> |
|||
<view class=""> |
|||
{{item.tel}} |
|||
<span v-if="item.is_default==1">默认</span> |
|||
</view> |
|||
</view> |
|||
<view class="idcard"> |
|||
<view class=""> |
|||
收货地址: |
|||
</view> |
|||
<view class="text-overflow"> |
|||
{{item.address}} |
|||
</view> |
|||
</view> |
|||
<view class="item-btn" style="justify-content: flex-end;"> |
|||
<view class="btn-list"> |
|||
<view class="btn-item" @click.stop="edit(item.id)"> |
|||
修改 |
|||
</view> |
|||
<view class="btn-item" @click.stop="delet(item)"> |
|||
删除 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btn-box"> |
|||
<navigator :url="showType ? '/subPackages/user/myAddressAdd' : '/subPackages/user/myContactsAdd'" class="btn"> |
|||
{{showType ? '添加收货地址' : '添加联系人'}} |
|||
</navigator> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "travelerList", |
|||
data() { |
|||
return { |
|||
showType: 0, |
|||
travelList: [], |
|||
addressList: [] |
|||
}; |
|||
}, |
|||
onLoad(option) { |
|||
this.showType = option.showType |
|||
console.log(this.showType) |
|||
}, |
|||
onShow() { |
|||
this.init() |
|||
}, |
|||
methods: { |
|||
init () { |
|||
// 出行人信息 |
|||
this.Post({contactType: 'CONTACT',offset: 0,limit: 100}, "/api/uservice/user/getContactOrConsignee").then(res => { |
|||
if (res) this.travelList = res.data |
|||
}) |
|||
|
|||
// 收货地址 |
|||
this.Post({contactType: 'CONSIGNEE',offset: 0,limit: 100}, '/api/uservice/user/getContactOrConsignee').then(res => { |
|||
if(res) this.addressList = res.data |
|||
}) |
|||
}, |
|||
delet(item) { |
|||
let that = this |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '确定要删除该出行人吗?', |
|||
success: function(res) { |
|||
if (res.confirm) { |
|||
if(that.showType == 0) { |
|||
that.Post({ |
|||
contactId: item.id |
|||
}, "/api/uservice/user/delContact").then(res => { |
|||
if (res) { |
|||
uni.showToast({ |
|||
icon: "none", |
|||
title: res.msg |
|||
}) |
|||
} |
|||
that.init() |
|||
}) |
|||
}else { |
|||
that.Post({ |
|||
id: item.id |
|||
}, "/api/uservice/user/delConsignee").then(res => { |
|||
if (res) { |
|||
uni.showToast({ |
|||
icon: "none", |
|||
title: res.msg |
|||
}) |
|||
} |
|||
that.init() |
|||
}) |
|||
} |
|||
} else if (res.cancel) { |
|||
console.log('用户点击取消'); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
defaultC(item) { |
|||
this.Post({ |
|||
id: item.id, |
|||
is_default: 1 |
|||
}, "/api/user/editContact").then(res => { |
|||
if (res.code == 1) { |
|||
this.travelList.forEach(i => i.is_default = 0) |
|||
item.is_default = !item.is_default |
|||
} |
|||
}) |
|||
}, |
|||
// 修改出行人信息 |
|||
edit(id){ |
|||
let url = '' |
|||
if(this.showType) { |
|||
url = '/subPackages/user/myAddressAdd?id='+id |
|||
}else { |
|||
url = "/subPackages/user/myContactsAdd?type=edit&id="+id |
|||
} |
|||
uni.navigateTo({ |
|||
url: url |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
position: relative; |
|||
background: #F7F7F7; |
|||
height: 100vh; |
|||
overflow-x: hidden; |
|||
padding-bottom: 200rpx; |
|||
} |
|||
|
|||
.cancat-nav{ |
|||
width: 100%; |
|||
display: flex; |
|||
height: 112rpx; |
|||
flex-shrink: 0; |
|||
background-color: #fff; |
|||
.concat-nav-item{ |
|||
ffont-weight: 500; |
|||
font-size: 35rpx; |
|||
color: #000000; |
|||
height: 100%; |
|||
text-align: center; |
|||
position: relative; |
|||
padding-top: 35rpx; |
|||
} |
|||
.concat-nav-item.active{ |
|||
color: #000000; |
|||
} |
|||
.active-bar{ |
|||
width: 73rpx; |
|||
height: 7rpx; |
|||
background: #515150; |
|||
border-radius: 3rpx; |
|||
margin: auto; |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
} |
|||
} |
|||
|
|||
.item { |
|||
width: 697rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
margin: 28rpx auto 0; |
|||
padding: 26rpx; |
|||
|
|||
.name, |
|||
.idcard { |
|||
display: flex; |
|||
font-size: 31rpx; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
|
|||
} |
|||
|
|||
.name { |
|||
view:last-child{ |
|||
margin-left: 40rpx; |
|||
} |
|||
|
|||
span { |
|||
padding: 3rpx 9rpx; |
|||
background: #515150; |
|||
border-radius: 7rpx; |
|||
font-weight: bold; |
|||
font-size: 24rpx; |
|||
color: #FFFFFF; |
|||
margin-left: 15rpx; |
|||
} |
|||
} |
|||
|
|||
.idcard { |
|||
margin-top: 26rpx; |
|||
|
|||
view:last-child { |
|||
margin-left: 14rpx; |
|||
font-weight: 400; |
|||
max-width: 492rpx; |
|||
|
|||
} |
|||
} |
|||
|
|||
.item-btn { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
margin-top: 40rpx; |
|||
|
|||
.choice { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
view:last-child { |
|||
margin-left: 20rpx; |
|||
|
|||
font-size: 27rpx; |
|||
|
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
image { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
|
|||
.yuan { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
background: rgba(255, 200, 37, 0); |
|||
border: 1rpx solid #999999; |
|||
border-radius: 20rpx; |
|||
} |
|||
} |
|||
|
|||
.btn-list { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
view { |
|||
width: 134rpx; |
|||
height: 54rpx; |
|||
background: #FFFFFF; |
|||
border: 1px solid #999999; |
|||
border-radius: 27rpx; |
|||
|
|||
|
|||
font-size: 27rpx; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
line-height: 52rpx; |
|||
text-align: center; |
|||
} |
|||
|
|||
view:last-child { |
|||
margin-left: 14rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btn-box { |
|||
position: fixed; |
|||
bottom: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 200rpx; |
|||
background-color: #fff; |
|||
|
|||
.btn { |
|||
width: 697rpx; |
|||
line-height: 80rpx; |
|||
background: #6A8A2D; |
|||
border-radius: 37rpx; |
|||
font-weight: 500; |
|||
font-size: 36rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
position: fixed; |
|||
bottom: 53rpx; |
|||
left: 26.67rpx; |
|||
} |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue