talk_appAmin/pages/signln/signaddress.vue

327 lines
7.0 KiB
Vue

<!-- 收货地址 地址管理 -->
<template>
<navbar_neadVue title="收货地址" background_color="#ffffff"></navbar_neadVue>
<view style="position: fixed; z-index: -1; background-color: #ffffff; top: 0; bottom: 0;left: 0;right: 0;"></view>
<view class="container">
<scroll-view class="scroll-container" scroll-y="true">
<view v-for="(item,index) in arr" :key="index">
<view class="haveaddress" @click="HaveAddress(item.id)">
<text class="textname">
{{item.name}}<text class="textphone">{{item.phone}}</text>
</text>
<text class="textaddress">{{item.address}} <text>{{item.detailedAddress}}</text></text>
<view
style="width: 638rpx;height: 2rpx;background: #f4f5f6; margin-top: 24rpx;margin-left: 24rpx;margin-right: 56rpx;">
</view>
<view style="float: right; margin-top: 27rpx;">
<image class="addbotimage" @click="Edit(item.id)" src="../../static/images/sign/edit.png">
</image>
<image class="addbotimage" @click="Delete(item.id)" src="../../static/images/sign/delete.png">
</image>
</view>
<view class="havebottom">
<image v-if="item.inCommonUse == '1'" @click="IsShow(item.id)" class="havebottomimage"
src="../../static/images/sign/isH.png"></image>
<image v-else @click="IsShow(item.id)" class="havebottomimage"
src="../../static/images/sign/IsHave.png"></image>
<text :class="item.inCommonUse == '1' ? 'havebotomisshowtext':'havebottomtext' ">常用地址</text>
</view>
</view>
</view>
</scroll-view>
<view class="fixed-button">
<view class="butview" @click="AddAddressClick()">
<view class="but">
<text>添加地址</text>
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
reactive,
ref,
watch,
getCurrentInstance
} from "vue";
const {
proxy
} = getCurrentInstance();
import navbar_neadVue from "@/pages/common/navbar/navbar_nead.vue";
// 将不常用地址转为常用地址
async function IsShow(id) {
var arrlist = arr.value.find(item => item.id == id);
arrlist.inCommonUse = '1';
console.log(arrlist);
updateSignAddress(arrlist).then(response => {})
getList();
}
const arr = ref([{
id: 11,
name: "吴先生",
phone: "19993439121",
address: "天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元120212号楼1单元120212号楼1单元1202天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元1202",
},
{
id: 2,
name: "王先生",
phone: "19993439121",
address: "天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元120212号楼1单元120212号楼1单元1202天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元1202",
},
{
id: 3,
name: "李先生",
phone: "19993439121",
address: "天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元120212号楼1单元120212号楼1单元1202天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元1202",
},
{
id: 3,
name: "李先生",
phone: "19993439121",
address: "天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元120212号楼1单元120212号楼1单元1202天津 天津市 河北区 建昌道街道红星北路诗景颂院12号楼1单元1202",
}
])
const IsCLick = ref(0)
function HaveAddress(id) {
IsCLick.value = id;
}
function returnTo() {
uni.navigateBack({
});
}
function AddAddressClick() {
proxy.$tab.navigateTo("/pages/signln/AddAddress")
}
import {
listSignAddress,
getSignAddress,
delSignAddress,
addSignAddress,
updateSignAddress,
listSignAddressUser
} from "@/api/signln/SignAddress/SignAddress";
/** 查询地址管理列表 */
const getList = () => {
listSignAddressUser().then(response => {
console.log(response.rows)
arr.value = response.rows;
if (arr.value.inCommonUse === '1') {
}
});
}
getList();
//删除
function Delete(id) {
uni.showModal({
title: '提示',
content: '确定删除当前地址吗?',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
delSignAddress(id).then(() => {
uni.showToast({
title: '删除成功',
//将值设置为 success 或者直接不用写icon这个参数
icon: 'success',
//显示持续时间为 2秒
duration: 2000
})
getList();
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
//修改
function Edit(id) {
proxy.$tab.navigateTo("/pages/signln/Editaddress?id=" + id)
}
</script>
<style scoped>
@import '@/pages/common/navbar/navbar.css';
.haveaddress {
width: 686rpx;
height: 238rpx;
border-radius: 24rpx 24rpx 24rpx 24rpx;
background: #ffffff;
margin-left: 32rpx;
margin-right: 32rpx;
margin-top: 24rpx;
}
.textname {
font-weight: Regular;
width: 72rpx;
height: 24rpx;
font-size: 24rpx;
text-align: left;
color: #000000;
margin-left: 24rpx;
}
.textphone {
margin-left: 27rpx;
}
.image {
width: 32rpx;
height: 32rpx;
vertical-align: middle;
float: right;
margin-right: 24rpx;
margin-top: 62rpx;
}
.textaddress {
color: #cbcbcb;
font-weight: Regular;
font-face: Microsoft YaHei;
font-size: 24rpx;
text-align: left;
line-height: 36rpx;
display: block;
margin-right: 51rpx;
margin-top: 27rpx;
margin-left: 24rpx;
overflow: hidden;
word-wrap: break-word;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.icons {
position: absolute;
width: 256rpx;
height: 232rpx;
left: 247rpx;
top: 219rpx;
}
.notext {
font-weight: Regular;
width: 276rpx;
height: 32rpx;
font-size: 30rpx;
text-align: left;
color: #00CCBE;
position: absolute;
left: 232rpx;
top: 480rpx;
}
.butview {
width: 750rpx;
height: 136rpx;
background: #ffffff;
position: absolute;
bottom: 68rpx;
}
.but {
width: 686rpx;
height: 88rpx;
border-radius: 44rpx 44rpx 44rpx 44rpx;
background: #c0f0ec;
margin-left: 32rpx;
}
.but>text {
font-weight: 600;
width: 123rpx;
height: 30rpx;
font-size: 30rpx;
text-align: left;
color: #00CCBE;
display: block;
margin: auto;
line-height: 88rpx;
margin-top: 22rpx;
}
.havebottom {
margin-left: 24rpx;
margin-top: 27rpx;
}
.havebottomimage {
width: 32rpx;
height: 32rpx;
vertical-align: middle;
}
.addbotimage {
width: 32rpx;
height: 29rpx;
margin-right: 24rpx;
}
.havebottomtext {
font-weight: Regular;
width: 111rpx;
height: 28rpx;
font-size: 24rpx;
text-align: left;
color: #999999;
margin-left: 12rpx;
vertical-align: middle;
}
.havebotomisshowtext {
font-weight: Regular;
width: 111rpx;
height: 28rpx;
font-size: 24rpx;
text-align: left;
color: #00CCBE;
margin-left: 12rpx;
vertical-align: middle;
}
.container {
display: flex;
flex-direction: column;
height: calc(100vh - 379rpx)
}
.scroll-container {
flex: 1;
overflow: auto;
}
</style>