@ -1,245 +0,0 @@ | |||
<template> | |||
<scroll-view | |||
scroll-y="true" | |||
:style="{height: height}" | |||
@scrolltolower="moreAddress"> | |||
<uv-radio-group v-model="selectAddress" | |||
@change="editDefault" | |||
v-if="addressList.length > 0"> | |||
<view v-for="item in addressList" :key="item.id" class="address-item"> | |||
<view class="address-item-top" | |||
@click="select(item)"> | |||
<view class="img-box"> | |||
<image src="../../static/address/icon.png" mode="aspectFill"></image> | |||
</view> | |||
<view class="address-info"> | |||
<view class="user-info"> | |||
<text class="user-name">{{ item.name }}</text> | |||
<text class="user-phone">{{ item.phone }}</text> | |||
<text v-if="item.defaultFlag == 1" class="is-default">默认</text> | |||
</view> | |||
<view class="address-detail"> | |||
{{ item.address + " " + item.addressDetail }} | |||
</view> | |||
</view> | |||
</view> | |||
<view class="controls" | |||
v-if="controls"> | |||
<view class="default-checkbox"> | |||
<uv-radio | |||
:name="item.id" | |||
label-disabled | |||
size="30rpx" | |||
icon-size="30rpx"> | |||
默认地址 | |||
</uv-radio> | |||
</view> | |||
<view class="edit-btn"> | |||
<uv-icon name="edit-pen"></uv-icon> | |||
<text @click="editAddress(item)" class="control-title">编辑</text> | |||
</view> | |||
<view class="del-btn"> | |||
<uv-icon name="trash"></uv-icon> | |||
<text class="control-title" @click="deleteAddress(item.id)">删除</text> | |||
</view> | |||
</view> | |||
</view> | |||
</uv-radio-group> | |||
<view | |||
style="padding: 100rpx 0;" | |||
v-else> | |||
<uv-empty | |||
mode="history" | |||
textSize="28rpx" | |||
iconSize="100rpx"/> | |||
</view> | |||
</scroll-view> | |||
</template> | |||
<script> | |||
export default { | |||
props : { | |||
controls : { | |||
default : false, | |||
type : Boolean, | |||
}, | |||
height : { | |||
default : 'calc(90vh - 180rpx)' | |||
} | |||
}, | |||
data() { | |||
return { | |||
selectAddress : 0, | |||
queryParams: { | |||
pageNo: 1, | |||
pageSize: 10, | |||
}, | |||
addressList: [], | |||
total : 0, | |||
} | |||
}, | |||
methods: { | |||
//获取地址列表 | |||
getAddressList() { | |||
return new Promise((success, fail) => { | |||
this.$api('addressPage', this.queryParams, res => { | |||
if (res.code == 200) { | |||
this.addressList = res.result.records || []; | |||
this.total = res.result.total || 0; | |||
res.result.records.forEach(n => { //筛选默认地址 | |||
console.log(n); | |||
if (n.defaultFlag == 1) { | |||
this.selectAddress = n.id | |||
} | |||
}) | |||
success(res.result) | |||
} | |||
}) | |||
}) | |||
}, | |||
// 加载更多 | |||
moreAddress(){ | |||
if(this.queryParams.pageSize > this.total){ | |||
return | |||
} | |||
this.queryParams.pageSize += 10 | |||
this.getAddressList() | |||
}, | |||
// 删除地址 | |||
deleteAddress(e){ | |||
this.$emit('deleteAddress', e) | |||
}, | |||
// 修改地址 | |||
editAddress(e){ | |||
this.$emit('editAddress', e) | |||
}, | |||
// 切换默认地址 | |||
editDefault(e){ | |||
this.$emit('editDefault', e) | |||
}, | |||
// 选择了地址 | |||
select(e){ | |||
this.$emit('select', e) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style scoped lang="scss"> | |||
.address-item { | |||
background: white; | |||
border-radius: 20rpx; | |||
overflow: hidden; | |||
margin-bottom: 20rpx; | |||
padding: 15rpx 15rpx 0rpx 15rpx; | |||
width: 680rpx; | |||
.address-item-top { | |||
border-bottom: 1px dashed #D3D1D1; | |||
display: flex; | |||
align-items: center; | |||
padding: 0rpx 0rpx 15rpx 0rpx; | |||
.img-box { | |||
width: 120rpx; | |||
height: 120rpx; | |||
image { | |||
width: 75%; | |||
height: 75%; | |||
display: block; | |||
margin: 12.5% auto; | |||
} | |||
} | |||
.address-info { | |||
width: calc(100% - 120rpx); | |||
height: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-between; | |||
.user-info { | |||
display: flex; | |||
align-items: center; | |||
text { | |||
display: block; | |||
line-height: 40rpx; | |||
margin-right: 20rpx; | |||
} | |||
.user-name, | |||
.user-phone { | |||
font-size: 30rpx; | |||
} | |||
.is-default { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
background: #FEB773; | |||
color: white; | |||
width: 80rpx; | |||
height: 35rpx; | |||
border-radius: 20rpx; | |||
font-size: 22rpx; | |||
} | |||
} | |||
.address-detail { | |||
color: #4a4a4a; | |||
font-size: 26rpx; | |||
overflow: hidden; | |||
display: -webkit-box; | |||
-webkit-box-orient: vertical; | |||
-webkit-line-clamp: 2; | |||
text-overflow: ellipsis; | |||
} | |||
} | |||
} | |||
.controls { | |||
display: flex; | |||
align-items: center; | |||
justify-content: space-between; | |||
align-items: center; | |||
font-size: 26rpx; | |||
padding: 15rpx 15rpx 25rpx 15rpx; | |||
.default-checkbox { | |||
display: flex; | |||
text { | |||
margin-left: 8rpx; | |||
} | |||
} | |||
.control-title { | |||
height: 30rpx; | |||
line-height: 30rpx; | |||
color: #666666; | |||
} | |||
view { | |||
display: flex; | |||
align-items: center; | |||
} | |||
image { | |||
width: 23rpx; | |||
height: 23rpx; | |||
vertical-align: middle; | |||
margin-right: 8rpx; | |||
} | |||
} | |||
} | |||
</style> |
@ -1,220 +0,0 @@ | |||
<template> | |||
<uv-popup round="40rpx" ref="addressPopup" :customStyle="{ height: 'auto' , width : '100%' , padding : '20rpx'}"> | |||
<view class="redact-address"> | |||
<view class="redact-address-title">{{title}}</view> | |||
<uv-form label-width="210rpx" :model="addressDetail" ref="form"> | |||
<uv-form-item label="联系人" prop="name"> | |||
<uv-input v-model="addressDetail.name" placeholder="请输入联系人姓名" border="none"> | |||
</uv-input> | |||
</uv-form-item> | |||
<uv-form-item label="手机号" prop="phone"> | |||
<uv-input v-model="addressDetail.phone" placeholder="请输入手机号" border="none"> | |||
</uv-input> | |||
</uv-form-item> | |||
<uv-form-item label="所在地区" prop="address"> | |||
<uv-input v-model="addressDetail.address" placeholder="请选择所在地区" border="none"> | |||
</uv-input> | |||
<template #right> | |||
<view style="padding-right: 40rpx;color: #FBAB32;" @click.stop="selectAddr"> | |||
<image src="../../static/address/selectIcon.png" mode="aspectFit"></image>定位 | |||
</view> | |||
</template> | |||
</uv-form-item> | |||
<uv-form-item label="详细地址" prop="addressDetail"> | |||
<uv-input v-model="addressDetail.addressDetail" placeholder="请输入详细地址" border="none"> | |||
</uv-input> | |||
</uv-form-item> | |||
</uv-form> | |||
<view @click="onSubmit" class="save">{{ addressDetail.id ? '修改地址' : '新增地址'}}</view> | |||
</view> | |||
</uv-popup> | |||
</template> | |||
<script> | |||
import Position from '@/utils/position.js' | |||
export default { | |||
data() { | |||
return { | |||
addressDetail: {} | |||
} | |||
}, | |||
props: { | |||
title: { | |||
type: String, | |||
default: '新增地址' | |||
} | |||
}, | |||
methods: { | |||
open(addressDetail) { | |||
this.addressDetail = addressDetail | |||
this.$refs.addressPopup.open('bottom') | |||
}, | |||
close(){ | |||
this.$refs.addressPopup.close() | |||
}, | |||
//新增和修改地址 | |||
onSubmit() { | |||
let isOk = this.parameterVerification(this.addressDetail) | |||
if (isOk && !isOk.auth) { | |||
return uni.showToast({ | |||
icon: 'none', | |||
title: isOk.title, | |||
'zIndex': 10000 | |||
}) | |||
} | |||
this.$emit('saveOrUpdate', this.addressDetail) | |||
}, | |||
//验证用户参数合法性 | |||
parameterVerification(addressDetaila) { | |||
let { | |||
name, | |||
phone, | |||
address, | |||
addressDetail | |||
} = addressDetaila | |||
if (name.trim() == '') { | |||
return { | |||
title: '请填写联系人', | |||
auth: false | |||
} | |||
} else if (phone.trim() == '') { | |||
return { | |||
title: '请填写手机号', | |||
auth: false | |||
} | |||
} else if (address.trim() == '') { | |||
return { | |||
title: '请填写所在地区', | |||
auth: false | |||
} | |||
} else if (addressDetail.trim() == '') { | |||
return { | |||
title: '请填写详细地址', | |||
auth: false | |||
} | |||
} else if (phone.trim() != '') { | |||
if (!this.$utils.verificationPhone(phone)) { | |||
return { | |||
title: '手机号格式不合法', | |||
auth: false | |||
} | |||
} | |||
} | |||
return { | |||
title: '验证通过', | |||
auth: true | |||
} | |||
}, | |||
//地图上选择地址 | |||
selectAddr() { | |||
Position.getLocation(res => { | |||
Position.selectAddress(res.longitude, res.latitude, success => { | |||
this.setAddress(success) | |||
}) | |||
}) | |||
}, | |||
//提取用户选择的地址信息复制给表单数据 | |||
setAddress(res) { | |||
//经纬度信息 | |||
this.addressDetail.latitude = res.latitude | |||
this.addressDetail.longitude = res.longitude | |||
if (!res.address && res.name) { //用户直接选择城市的逻辑 | |||
return this.addressDetail.address = res.name | |||
} | |||
if (res.address || res.name) { | |||
return this.addressDetail.address = res.address + res.name | |||
} | |||
this.addressDetail.address = '' //用户啥都没选就点击勾选 | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.redact-address { | |||
box-sizing: border-box; | |||
.redact-address-title { | |||
height: 80rpx; | |||
line-height: 80rpx; | |||
font-size: 30rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.save { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
width: 90%; | |||
height: 80rpx; | |||
border-radius: 40rpx; | |||
color: white; | |||
font-size: 28rpx; | |||
margin: 0rpx auto; | |||
background: $uni-color; | |||
margin-top: 150rpx; | |||
} | |||
image { | |||
width: 25rpx; | |||
height: 25rpx; | |||
} | |||
//修改组件默认样式 | |||
.uv-form { | |||
padding: 30rpx 0rpx; | |||
} | |||
&::v-deep .uv-cell { | |||
padding: 0rpx 0rpx; | |||
font-size: 26rpx; | |||
&::after { | |||
border: none !important; | |||
} | |||
.uv-field__label { | |||
display: flex; | |||
align-items: center; | |||
height: 80rpx; | |||
} | |||
.uv-field__control, | |||
.uv-field__right-icon { | |||
height: 80rpx; | |||
font-size: 26rpx; | |||
border-bottom: 2rpx solid #cbc8c8; | |||
} | |||
.uv-field__right-icon { | |||
display: flex; | |||
align-items: center; | |||
height: 78rpx; | |||
color: #5FCC9F; | |||
} | |||
.uv-cell__value { | |||
height: 120rpx; | |||
} | |||
} | |||
&::v-deep .uv-field__error-message { | |||
color: #5AC796; | |||
font-size: 20rpx; | |||
margin-top: 10rpx; | |||
} | |||
} | |||
</style> |
@ -1,77 +0,0 @@ | |||
<template> | |||
<view class="submit"> | |||
<view class="" | |||
@click="$emit('share')"> | |||
<uv-icon | |||
size="40rpx" | |||
name="share-square"></uv-icon> | |||
<view class=""> | |||
分享 | |||
</view> | |||
</view> | |||
<view class="" | |||
@click="$utils.navigateTo('/index/cart')"> | |||
<uv-icon | |||
size="40rpx" | |||
name="shopping-cart"></uv-icon> | |||
<view class=""> | |||
购物车 | |||
</view> | |||
</view> | |||
<view class="btn" | |||
@click="$emit('submit')"> | |||
{{ submiitTitle }} | |||
</view> | |||
</view> | |||
</template> | |||
<script> | |||
export default { | |||
name:"submit", | |||
props : { | |||
submiitTitle : { | |||
default : '立即租赁', | |||
type : String, | |||
} | |||
}, | |||
data() { | |||
return { | |||
} | |||
}, | |||
methods: { | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.submit{ | |||
position: fixed; | |||
bottom: 0; | |||
left: 0; | |||
width: 100vw; | |||
background-color: #fff; | |||
height: 100rpx; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
font-size: 24rpx; | |||
.btn{ | |||
background: $uni-color; | |||
width: 600rpx; | |||
height: 80rpx; | |||
color: #fff; | |||
border-radius: 40rpx; | |||
font-size: 28rpx; | |||
} | |||
view{ | |||
width: 100rpx; | |||
margin: 0 10rpx; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
flex-direction: column; | |||
} | |||
} | |||
</style> |
@ -1,367 +0,0 @@ | |||
<template> | |||
<uv-popup ref="popup" | |||
:round="30" | |||
bgColor="#f7f7f7"> | |||
<view class="content"> | |||
<!-- 地址 --> | |||
<view class="address" | |||
@click="openAddress"> | |||
<image src="../../static/address/selectIcon.png" mode=""></image> | |||
<view class=""> | |||
{{ address.name }} | |||
</view> | |||
<view class=""> | |||
{{ address.addressDetail }} | |||
</view> | |||
<view class="icon"> | |||
<uv-icon | |||
size="30rpx" | |||
name="arrow-right"></uv-icon> | |||
</view> | |||
</view> | |||
<!-- 商品信息和数量 --> | |||
<view class="submit-info"> | |||
<view class="title"> | |||
桌布租赁 | |||
</view> | |||
<view class="box"> | |||
<image | |||
class="image" | |||
:src="unit.pic" | |||
mode=""></image> | |||
<view class="info"> | |||
<view class="price"> | |||
¥<text>{{ unit.depositPrice }}</text>元 | |||
</view> | |||
<view class="unit"> | |||
请选择规格 | |||
</view> | |||
<view class=""> | |||
<uv-number-box v-model="num"></uv-number-box> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
<!-- 规格 --> | |||
<view class="submit-unit"> | |||
<view class="title"> | |||
规格选择 | |||
</view> | |||
<view class="list"> | |||
<view :class="{act : unitIndex == index}" | |||
v-for="(item, index) in detail.hotelGoodsSkuList" | |||
@click="selectUnit(item, index)" | |||
:key="index"> | |||
{{ item.title }} | |||
</view> | |||
</view> | |||
</view> | |||
<!-- 费用明细 --> | |||
<view class="expense-detail"> | |||
<view class="title"> | |||
费用明细 | |||
</view> | |||
<view class="detail"> | |||
押金:¥{{ unit.depositPrice }} | |||
</view> | |||
</view> | |||
<!-- 提交按钮 --> | |||
<view class="submit-btn"> | |||
<view class="l" | |||
@click="addCart"> | |||
加入租赁车 | |||
</view> | |||
<view class="r" | |||
@click="orderPay"> | |||
{{ submiitTitle }} | |||
</view> | |||
</view> | |||
</view> | |||
<uv-popup ref="addressPopup" :round="30"> | |||
<addressList | |||
ref="addressList" | |||
height="60vh" | |||
@select="selectAddress" | |||
/> | |||
</uv-popup> | |||
</uv-popup> | |||
</template> | |||
<script> | |||
import addressList from '../address/addressList.vue' | |||
export default { | |||
components : { | |||
addressList, | |||
}, | |||
props : { | |||
submiitTitle : { | |||
default : '立即租赁', | |||
type : String, | |||
}, | |||
detail : { | |||
default : {} | |||
} | |||
}, | |||
data() { | |||
return { | |||
unitIndex : 0, | |||
address : { | |||
name : '请选择联系人', | |||
addressDetail : '', | |||
}, | |||
num : 1, | |||
unit : {}, | |||
addressTotal : 0, | |||
} | |||
}, | |||
methods: { | |||
// 打开 | |||
open(){ | |||
this.$refs.popup.open('bottom') | |||
if(!this.unit.id){ | |||
this.selectUnit(this.detail.hotelGoodsSkuList[0], 0) | |||
} | |||
// 获取地址列表 | |||
this.$refs.addressList.getAddressList().then(res => { | |||
this.addressTotal = res.total | |||
if(this.addressTotal != 0){ | |||
this.address = res.records[0] | |||
} | |||
}) | |||
}, | |||
// 关闭 | |||
close(){ | |||
this.$refs.popup.close() | |||
}, | |||
// 打开选择地址 | |||
openAddress(){ | |||
if (this.addressTotal == 0) { | |||
this.$refs.popup.close() | |||
return uni.navigateTo({ | |||
url: '/pages_order/mine/address?type=back' | |||
}) | |||
} | |||
this.$refs.addressPopup.open('bottom') | |||
}, | |||
// 选择地址 | |||
selectAddress(e){ | |||
this.address = e | |||
this.$refs.addressPopup.close() | |||
}, | |||
// 选择规格 | |||
selectUnit(item, index){ | |||
this.unit = item | |||
this.unitIndex = index | |||
}, | |||
addCart(){ | |||
this.$api('cartAdd', { | |||
id : this.detail.id, | |||
skuId : this.unit.id, | |||
}, res => { | |||
if(res.code == 200){ | |||
uni.showToast({ | |||
title: '添加成功', | |||
}); | |||
this.$refs.popup.close() | |||
} | |||
}) | |||
}, | |||
orderPay(){ | |||
let data = { | |||
id : this.detail.id,//商品id | |||
skuId : this.unit.id,//规格id | |||
addressId : this.address.id,//地址id | |||
sku : this.unit.title,//规格 | |||
num : this.num, | |||
} | |||
if(this.$utils.verificationAll(data, { | |||
skuId : '请选择规格', | |||
addressId : '请选择地址', | |||
})){ | |||
return | |||
} | |||
this.$api('orderPay', data, res => { | |||
if(res.code == 200){ | |||
uni.redirectTo({ | |||
url: '/pages/index/order' | |||
}) | |||
// uni.requestPayment({ | |||
// provider: 'wxpay', // 服务提提供商 | |||
// timeStamp: res.result.timeStamp, // 时间戳 | |||
// nonceStr: res.result.nonceStr, // 随机字符串 | |||
// package: res.result.packageValue, | |||
// signType: res.result.signType, // 签名算法 | |||
// paySign: res.result.paySign, // 签名 | |||
// success: function (res) { | |||
// console.log('支付成功',res); | |||
// uni.redirectTo({ | |||
// url: '/pages/index/order' | |||
// }) | |||
// }, | |||
// fail: function (err) { | |||
// console.log('支付失败',err); | |||
// uni.showToast({ | |||
// icon:'none', | |||
// title:"支付失败" | |||
// }) | |||
// } | |||
// }); | |||
} | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style scoped lang="scss"> | |||
.content{ | |||
max-height: 80vh; | |||
overflow: hidden; | |||
overflow-y: auto; | |||
.address{ | |||
display: flex; | |||
padding: 20rpx; | |||
background-color: #fff; | |||
image{ | |||
width: 30rpx; | |||
height: 30rpx; | |||
margin: 20rpx; | |||
} | |||
view{ | |||
margin: 20rpx; | |||
overflow:hidden; //超出的文本隐藏 | |||
text-overflow:ellipsis; //溢出用省略号显示 | |||
white-space:nowrap; //溢出不换行 | |||
} | |||
.icon{ | |||
margin-left: auto; | |||
} | |||
} | |||
.submit-info{ | |||
background-color: #fff; | |||
padding: 30rpx; | |||
margin-top: 20rpx; | |||
.title{ | |||
font-size: 30rpx; | |||
padding: 10rpx; | |||
font-weight: 600; | |||
} | |||
.box{ | |||
display: flex; | |||
margin-top: 10rpx; | |||
.image{ | |||
width: 200rpx; | |||
height: 200rpx; | |||
border-radius: 20rpx; | |||
margin-right: 20rpx; | |||
} | |||
.info{ | |||
flex: 1; | |||
.unit{ | |||
font-size: 24rpx; | |||
padding: 10rpx 20rpx; | |||
color: #717171; | |||
display: flex; | |||
align-items: center; | |||
} | |||
.price{ | |||
color: $uni-color; | |||
font-size: 28rpx; | |||
padding: 10rpx 20rpx; | |||
text{ | |||
font-size: 36rpx; | |||
font-weight: 900; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
.submit-unit{ | |||
padding: 30rpx; | |||
background-color: #fff; | |||
.title{ | |||
font-size: 28rpx; | |||
font-weight: 600; | |||
} | |||
.list{ | |||
display: flex; | |||
flex-wrap: wrap; | |||
font-size: 22rpx; | |||
.act{ | |||
color: $uni-color; | |||
border: 1px solid $uni-color; | |||
background-color: #F9E7DE; | |||
} | |||
view{ | |||
border-radius: 15rpx; | |||
width: 320rpx; | |||
background-color: #F3F3F3; | |||
border: 1px solid #F3F3F3; | |||
margin: 10rpx; | |||
display: flex; | |||
justify-content: center; | |||
padding: 15rpx 0; | |||
} | |||
} | |||
} | |||
.expense-detail{ | |||
padding: 30rpx; | |||
background-color: #fff; | |||
font-size: 28rpx; | |||
.title{ | |||
font-weight: 600; | |||
} | |||
.detail{ | |||
background-color: #F6F6F6; | |||
color: #717171; | |||
margin: 10rpx 0; | |||
padding: 10rpx 20rpx; | |||
} | |||
} | |||
.submit-btn{ | |||
width: 600rpx; | |||
height: 80rpx; | |||
color: #fff; | |||
border-radius: 40rpx; | |||
font-size: 28rpx; | |||
margin: 20rpx auto; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
border: 1rpx solid $uni-color; | |||
overflow: hidden; | |||
.l{ | |||
flex: 1; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
color: $uni-color; | |||
} | |||
.r{ | |||
background: $uni-color; | |||
flex: 1; | |||
height: 100%; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
} | |||
} | |||
} | |||
</style> |
@ -1,213 +0,0 @@ | |||
<template> | |||
<view class="address"> | |||
<navbar title="地址管理" leftClick @leftClick="leftClick" /> | |||
<view class="address-list"> | |||
<addressList | |||
controls | |||
ref="addressList" | |||
@deleteAddress="deleteAddress" | |||
@editAddress="editAddress" | |||
@editDefault="editDefault"/> | |||
</view> | |||
<redactAddress | |||
ref="addressPopup" | |||
:addressDetail="addressDetail" | |||
@saveOrUpdate="saveOrUpdate" | |||
:title="title"></redactAddress> | |||
<view class="add-btn"> | |||
<view @click="addBtn" class="btn"> | |||
新增地址 | |||
</view> | |||
</view> | |||
</view> | |||
</template> | |||
<script> | |||
import redactAddress from '../components/address/redactAddress.vue' | |||
import addressList from '../components/address/addressList.vue' | |||
export default { | |||
components: { | |||
redactAddress, | |||
addressList | |||
}, | |||
data() { | |||
return { | |||
title: '新增地址', | |||
type : '', | |||
} | |||
}, | |||
onLoad(args) { | |||
this.type = args.type | |||
if(this.type == 'back'){ | |||
this.addBtn() | |||
} | |||
}, | |||
onShow() { | |||
this.getAddressList() | |||
}, | |||
methods: { | |||
//获取地址列表 | |||
getAddressList() { | |||
this.$refs.addressList.getAddressList() | |||
}, | |||
//获取地址详情 | |||
editAddress(address) { | |||
this.$refs.addressPopup.open({...address}) | |||
}, | |||
//返回个人中心 | |||
leftClick() { | |||
uni.navigateBack(-1) | |||
}, | |||
//添加和修改地址 | |||
saveOrUpdate(addressDetail) { | |||
let data = { | |||
name: addressDetail.name, | |||
phone: addressDetail.phone, | |||
address: addressDetail.address, | |||
addressDetail: addressDetail.addressDetail, | |||
defaultId: addressDetail.defaultId || '0', | |||
latitude: addressDetail.latitude, | |||
longitude: addressDetail.longitude | |||
} | |||
if (addressDetail.id) { | |||
data.id = addressDetail.id | |||
} | |||
this.$api(data.id ? 'addressEdit' : 'addressAdd', data, res => { | |||
if (res.code == 200) { | |||
this.$refs.addressPopup.close() | |||
this.getAddressList() | |||
if(this.type == 'back'){ | |||
uni.navigateBack(-1) | |||
} | |||
uni.showToast({ | |||
title: '操作成功', | |||
icon: 'none' | |||
}) | |||
} | |||
}) | |||
}, | |||
//修改默认地址 | |||
editDefault(id) { | |||
this.$api('addressDefault', { | |||
id: id, | |||
}, res => { | |||
if (res.code == 200) { | |||
this.$refs.addressPopup.close() | |||
uni.showToast({ | |||
title: '操作成功', | |||
icon: 'none' | |||
}) | |||
this.getAddressList() | |||
} | |||
}) | |||
}, | |||
//删除地址 | |||
deleteAddress(id) { | |||
let self = this | |||
uni.showModal({ | |||
title: '删除地址', | |||
content: '确认删除此地址?删除后数据不可恢复', | |||
success(e) { | |||
if(e.confirm){ | |||
self.$api('addressDelete', { | |||
id | |||
}, res => { | |||
if (res.code == 200) { | |||
uni.showToast({ | |||
title: '删除成功', | |||
icon: 'none' | |||
}) | |||
self.getAddressList() | |||
} | |||
}) | |||
} | |||
} | |||
}) | |||
}, | |||
//点击新增按钮 | |||
addBtn() { | |||
this.title = '新增地址' | |||
this.$refs.addressPopup.open({ //初始化数据 | |||
name: '', | |||
phone: '', | |||
address: '', | |||
addressDetail: '', | |||
defaultId: '', | |||
latitude: '', | |||
longitude: '' | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.address { | |||
width: 750rpx; | |||
margin: 0rpx auto; | |||
background: #F5F5F5; | |||
box-sizing: border-box; | |||
min-height: 100vh; | |||
.address-list { | |||
padding: 40rpx 20rpx 120rpx 20rpx; | |||
} | |||
.add-btn { | |||
position: fixed; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
left: 0; | |||
bottom: 0; | |||
width: 750rpx; | |||
height: 100rpx; | |||
background: white; | |||
.btn { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
width: 85%; | |||
height: 80rpx; | |||
border-radius: 40rpx; | |||
color: white; | |||
text-align: center; | |||
font-size: 28rpx; | |||
background: $uni-color; | |||
} | |||
} | |||
} | |||
@media all and (min-width: 961px) { | |||
.add-btn { | |||
left: 50% !important; | |||
transform: translateX(-50%); | |||
} | |||
} | |||
//选择位置地图样式 | |||
:deep(.uni-system-choose-location) { | |||
z-index: 99999 !important; | |||
} | |||
</style> |
@ -0,0 +1,61 @@ | |||
<template> | |||
<view> | |||
<navbar leftClick @leftClick="$utils.navigateBack" /> | |||
<view class="search"> | |||
<uv-search | |||
placeholder="请输入岗位/公司名称" | |||
:showAction="false" | |||
search-icon-size="40rpx" | |||
@search="search" | |||
v-model="keyword"></uv-search> | |||
</view> | |||
<!-- 筛选器 --> | |||
<screenWork @clickItem="clickItem"/> | |||
<!-- 老板看到的 --> | |||
<userList ref="workList" v-if="role"/> | |||
<!-- 工人看到的 --> | |||
<workList ref="workList" v-else/> | |||
</view> | |||
</template> | |||
<script> | |||
import screenWork from '@/components/screen/screenWork.vue' | |||
import workList from '@/components/list/workList/index.vue' | |||
import userList from '@/components/list/userList/index.vue' | |||
import { | |||
mapState, | |||
} from 'vuex' | |||
export default { | |||
components : { | |||
workList, | |||
screenWork, | |||
userList, | |||
}, | |||
computed: { | |||
...mapState(['userInfo', 'role']), | |||
}, | |||
data() { | |||
return { | |||
keyword : '', | |||
} | |||
}, | |||
methods: { | |||
} | |||
} | |||
</script> | |||
<style scoped lang="scss"> | |||
.search{ | |||
width: 700rpx; | |||
background-color: #fff; | |||
/deep/ .uv-search__content__icon{ | |||
padding: 10rpx 0; | |||
} | |||
} | |||
</style> |