NurseStationApp/pages/modifyAddress/modifyAddress.vue

341 lines
6.6 KiB
Vue
Raw Normal View History

2022-10-20 19:39:57 +08:00
<template>
<view class="app">
<view class="address" v-for="(item,index) in goodPatient" :key="index">
<view class="addressinfo">
<view class="item">
{{item.receiveName}},{{item.receivePhone}}
</view>
<view class="item detail">
{{item.receiveAddress}}
</view>
<view class="update">
<view class="up ups" @tap='updata(item)'>
修改
</view>
<view class="up" @tap='del(item)'>
删除
</view>
<!-- <u-modal width="50%" v-model="delshow" style='background-color: rgba(118, 118, 118, 0.6);'
@confirm='delconfirm' :content="content" show-cancel-button>
</u-modal> -->
</view>
</view>
</view>
<view class="ADDress" @tap='add()'>
<image src="../../static/add.png" mode=""></image>
<span class="ADDtext">
添加收货地址
</span>
</view>
<!-- 弹框 -->
<u-popup v-model="show" mode="center" width="80%" height="50%" border-radius="30">
<view class="payment">
添加收货地址
<view class="cencel" @tap="cencel()">
<image src="../../static/gb.png" mode=""></image>
</view>
<view class="addinfos">
<u-field v-model="list.receiveName" label="收货人" placeholder="姓名" class="items">
</u-field>
<u-field v-model="list.receivePhone" label="手机号" placeholder="电话" class="items">
</u-field>
<view class="area">
<u-field v-model="list.areaCode" label="地区" placeholder="请选择" class="items">
</u-field>
<image src="../../static/jiantou.png" mode=""></image>
</view>
<u-field v-model="list.receiveAddress" label-width="170" label="详细地址" placeholder="如街道、门牌号、小区等"
class="items">
</u-field>
</view>
<view class="save" @tap='submit()'>
保存
</view>
<u-toast ref="uToast" />
</view>
</u-popup>
</view>
</template>
<script>
import {
goodPatientInfo,
addnursingStation,
delnursingStation,
nursingStationGoodsinfo,
updatenursingStation,
} from '@/api/modifyAddress/modifyAddress.js';
import baseurl from '@/api/baseurl.js'
export default {
data() {
return {
isedit: true, //标识
delshow: false, //删除弹框
content: '确认要删除信息吗?',
show: false, //弹框
list: {
receiveName: '',
receivePhone: '',
receiveAddress: '',
areaCode: '',
patientId: 2,
},
goodPatient: [], // 查询地址信息
patientId: 2,
// delId: '',
}
},
onLoad(options) {
//获取传值
this.goodsList()
},
methods: {
// 查询地址信息
goodsList() {
goodPatientInfo(this.patientId).then(res => {
this.goodPatient = res.data
console.log(this.goodPatient)
})
},
// 保存按钮
submit() {
let that=this
if (that.isedit == true) {
addnursingStation(that.list).then(res => {
if (res.code == 200) {
that.$refs.uToast.show({
title: '新增成功',
duration: 20000000
});
that.show = false;
// console.log(res)
that.goodsList()
that.list = {}
}
})
} else {
updatenursingStation(that.list).then(res => {
uni.showToast({
title: '修改成功',
duration: 2000
});
that.show = false;
// console.log(res)
that.goodsList()
// this.list = {}
})
}
},
// 修改按钮
updata(item) {
this.isedit = false
nursingStationGoodsinfo(item.id).then(res => {
console.log(item)
this.list = res.data
this.show = true
})
},
// 新增
add() {
this.isedit = true
this.show = true
},
// delconfirm() {
// // console.log(1111)
// delnursingStation(this.delId).then(res => {
// if (res.code == 200) {
// this.$refs.uToast.show({
// title: '删除成功',
// type: 'success',
// duration: 2000
// })
// this.delshow = false;
// console.log(res)
// this.goodsList()
// }
// })
// },
// 删除
del(item) {
let that=this
uni.showModal({
title: '提示',
content: '确认要删除信息吗',
success: function(res) {
if (res.confirm) {
delnursingStation(item.id).then(res => {
uni.showToast({
title: '删除成功',
duration: 2000,
});
console.log(111),
that.delshow = false;
that.goodsList()
// console.log(this)
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
// this.delId = item.id
// this.delshow = true
},
// 取消
cencel() {
this.show = false
this.list = {}
}
}
}
</script>
<style lang="scss">
::v-deep .u-mask {
background-color: rgba(118, 118, 118, 0.6);
}
.app {
padding: 4%;
.address {
/* position: absolute; */
width: 99%;
height: 270rpx;
background: #FFFFFF;
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
border-radius: 20rpx;
margin: 0 auto;
margin-bottom: 20rpx;
.item {
width: 90%;
height: 101rpx;
font-size: 36rpx;
color: #000000;
line-height: 101rpx;
margin: 0 auto;
}
.detail {
border-bottom: 5rpx solid #F4F5F7;
margin-top: -20rpx;
}
.update {
display: flex;
margin: 18rpx 18rpx 18rpx 432rpx;
}
.up {
width: 114rpx;
height: 64rpx;
line-height: 64rpx;
text-align: center;
background: #FFFFFF;
border: 1rpx solid #969394;
border-radius: 26px;
font-size: 31rpx;
color: #969394;
}
.ups {
margin-right: 30rpx;
}
}
.ADDress {
width: 80%;
height: 80rpx;
line-height: 80rpx;
background: #4C7BC9;
border-radius: 26rpx;
font-size: 34rpx;
color: #FFFFFF;
text-align: center;
position: fixed;
bottom: 5rpx;
left: 10%;
image {
width: 41rpx;
height: 41rpx;
vertical-align: middle
}
.ADDtext {
padding-left: 10rpx;
}
}
// 弹框支付
.payment {
width: 90%;
height: 110rpx;
font-size: 36rpx;
color: #000000;
line-height: 110rpx;
text-align: center;
margin: 0 auto;
border-bottom: 1rpx solid #D8D4D4;
image {
width: 31rpx;
height: 31rpx;
float: right;
margin: -60rpx 20rpx 0 0;
}
.save {
width: 226rpx;
border-radius: 26px;
height: 71rpx;
line-height: 71rpx;
background: #4C7BC9;
border-radius: 26rpx;
text-align: center;
font-size: 34rpx;
color: #FFFFFF;
margin: 0 auto;
margin-top: 10%;
}
}
.area {
image {
width: 18rpx;
height: 26rpx;
}
}
.items {
font-size: 32rpx;
color: #030001;
line-height: 40rpx;
}
}
</style>