21 changed files with 1029 additions and 964 deletions
Unified View
Diff Options
-
+2 -2App.vue
-
+1 -1api/api.js
-
+87 -87components/base/centerList.vue
-
+1 -1components/base/tabbar.vue
-
+1 -2components/config/configPopup.vue
-
+7 -5components/config/customerServicePopup.vue
-
+1 -1config.js
-
+6 -2pages/index/center2.vue
-
+7 -7pages/index/index.vue
-
+11 -9pages/index/tradingPlatform.vue
-
+9 -9pages_order/auth/customsClearApply.vue
-
+2 -2pages_order/auth/loginAndRegisterAndForgetPassword.vue
-
+20 -5pages_order/auth/registerShop.vue
-
+37 -3pages_order/auth/selectionIdentity.vue
-
+197 -200pages_order/center/addressListManage.vue
-
+224 -225pages_order/components/address/addressList.vue
-
+215 -215pages_order/components/address/redactAddress.vue
-
+1 -1pages_order/mine/address.vue
-
+9 -3pages_order/tradingPlatform/confirmOrder.vue
-
+173 -170pages_order/tradingPlatform/nowOrder.vue
-
+18 -14store/store.js
+ 2
- 2
App.vue
View File
+ 1
- 1
api/api.js
View File
+ 87
- 87
components/base/centerList.vue
View File
| @ -1,96 +1,96 @@ | |||||
| <template> | <template> | ||||
| <view class="content"> | |||||
| <view class="item" v-for="(item, index) in list" :key="index" @click="tapItem(item, index)"> | |||||
| <view class="key"> | |||||
| <view class="img"> | |||||
| <img :src="item.imgUrl" style="width: 100%; height: 100%;"/> | |||||
| </view> | |||||
| <view class="text"> | |||||
| {{ item.text }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="value"> | |||||
| {{ item.value }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="content"> | |||||
| <view class="item" v-for="(item, index) in list" :key="index" @click="tapItem(item, index)"> | |||||
| <view class="key"> | |||||
| <view class="img"> | |||||
| <img :src="item.imgUrl" style="width: 100%; height: 100%;" /> | |||||
| </view> | |||||
| <view class="text"> | |||||
| {{ item.text }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="value"> | |||||
| {{ item.value }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| export default { | |||||
| name: "centerList", | |||||
| props: { | |||||
| list: {} | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 点击列表项 | |||||
| tapItem(item, index) { | |||||
| console.log(item, index, "item,index==========") | |||||
| if (item.text === '联系客服' || item.englishText === 'contactCustomerService') { | |||||
| console.log("联系客服") | |||||
| this.$emit('open') | |||||
| } else if ( | |||||
| item.text === '我的挂单' || item.englishText === 'myOrders' || | |||||
| item.text === '系统设置' || item.englishText === 'systemSettings' || | |||||
| item.text === '关于我们' || item.englishText === 'aboutUs' || | |||||
| item.text === '帮助反馈' || item.englishText === 'helpFeedback' || | |||||
| item.text === '我的订单' || item.englishText === 'Myorder' | |||||
| ) { | |||||
| console.log("进入 " + item.text) | |||||
| uni.navigateTo({ | |||||
| url: item.toPathUrl | |||||
| }) | |||||
| } | |||||
| } | |||||
| , | |||||
| }, | |||||
| } | |||||
| export default { | |||||
| name: "centerList", | |||||
| props: { | |||||
| list: {} | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 点击列表项 | |||||
| tapItem(item, index) { | |||||
| console.log(item, index, "item,index==========") | |||||
| if(item.text === '关于我们'){ | |||||
| this.$emit('about') | |||||
| }else if (item.text === '联系客服' || item.englishText === 'contactCustomerService') { | |||||
| console.log("联系客服") | |||||
| this.$emit('open') | |||||
| } else if ( | |||||
| item.text === '我的挂单' || item.englishText === 'myOrders' || | |||||
| item.text === '系统设置' || item.englishText === 'systemSettings' || | |||||
| item.text === '帮助反馈' || item.englishText === 'helpFeedback' || | |||||
| item.text === '我的订单' || item.englishText === 'Myorder' | |||||
| ) { | |||||
| console.log("进入 " + item.text) | |||||
| uni.navigateTo({ | |||||
| url: item.toPathUrl | |||||
| }) | |||||
| } | |||||
| }, | |||||
| }, | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| .content { | |||||
| background-color: #2e2e2e; | |||||
| .item { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| padding: 20rpx 40rpx; | |||||
| .key { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .img { | |||||
| width: 40rpx; | |||||
| height: 40rpx; | |||||
| } | |||||
| .text { | |||||
| margin-left: 20rpx; | |||||
| } | |||||
| } | |||||
| .value { | |||||
| color: #FFF; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .content { | |||||
| background-color: #2e2e2e; | |||||
| .item { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| padding: 20rpx 40rpx; | |||||
| .key { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .img { | |||||
| width: 40rpx; | |||||
| height: 40rpx; | |||||
| } | |||||
| .text { | |||||
| margin-left: 20rpx; | |||||
| } | |||||
| } | |||||
| .value { | |||||
| color: #FFF; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | </style> | ||||
+ 1
- 1
components/base/tabbar.vue
View File
+ 1
- 2
components/config/configPopup.vue
View File
+ 7
- 5
components/config/customerServicePopup.vue
View File
+ 1
- 1
config.js
View File
+ 6
- 2
pages/index/center2.vue
View File
+ 7
- 7
pages/index/index.vue
View File
+ 11
- 9
pages/index/tradingPlatform.vue
View File
+ 9
- 9
pages_order/auth/customsClearApply.vue
View File
+ 2
- 2
pages_order/auth/loginAndRegisterAndForgetPassword.vue
View File
+ 20
- 5
pages_order/auth/registerShop.vue
View File
+ 37
- 3
pages_order/auth/selectionIdentity.vue
View File
+ 197
- 200
pages_order/center/addressListManage.vue
View File
| @ -1,214 +1,211 @@ | |||||
| <template> | <template> | ||||
| <view class="address"> | |||||
| <view class="address"> | |||||
| <navbar title="地址管理" leftClick @leftClick="leftClick" /> | |||||
| <navbar title="地址管理" leftClick @leftClick="leftClick" /> | |||||
| <view class="address-list"> | |||||
| <addressList | |||||
| controls | |||||
| ref="addressList" | |||||
| @deleteAddress="deleteAddress" | |||||
| @editAddress="editAddress" | |||||
| @editDefault="editDefault"/> | |||||
| </view> | |||||
| <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> | |||||
| <redactAddress ref="addressPopup" @saveOrUpdate="saveOrUpdate" :title="title"> | |||||
| </redactAddress> | |||||
| <view class="add-btn"> | |||||
| <view @click="addBtn" class="btn"> | |||||
| 新增地址 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="add-btn"> | |||||
| <view @click="addBtn" class="btn"> | |||||
| 新增地址 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <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() | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| 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 | |||||
| } | |||||
| console.log(addressDetail.id,"addressDetail.id") | |||||
| if (addressDetail.id) { | |||||
| data.id = addressDetail.id | |||||
| } | |||||
| this.$api(data.id ? 'editAddress' : 'addAddress', 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('editAddress', { | |||||
| id: id, | |||||
| defaultFlag: 1 | |||||
| }, res => { | |||||
| if (res.code == 200) { | |||||
| this.$refs.addressPopup.close() | |||||
| uni.showToast({ | |||||
| title: '操作成功', | |||||
| icon: 'none' | |||||
| }) | |||||
| this.getAddressList() | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //删除地址 | |||||
| deleteAddress(id) { | |||||
| let self = this | |||||
| uni.showModal({ | |||||
| title: this.$t('components.deleteAddress'), | |||||
| content: this.$t('components.confirmDeleteAddress'), | |||||
| success(e) { | |||||
| if(e.confirm){ | |||||
| self.$api('editAddress', {id: id, isDisable: 1, defaultFla: 0}, res => { | |||||
| if (res.code == 200) { | |||||
| uni.showToast({ | |||||
| title: this.$t('components.deleteSuccessful'), | |||||
| icon: 'none' | |||||
| }) | |||||
| self.getAddressList() | |||||
| } | |||||
| }) | |||||
| } | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //点击新增按钮 | |||||
| addBtn() { | |||||
| this.title = '新增地址' | |||||
| this.$refs.addressPopup.open({ //初始化数据 | |||||
| name: '', | |||||
| phone: '', | |||||
| address: '', | |||||
| addressDetail: '', | |||||
| defaultId: '', | |||||
| latitude: '', | |||||
| longitude: '' | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| 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() | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| 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, | |||||
| defaultFlag: addressDetail.defaultFlag || '0', | |||||
| latitude: addressDetail.latitude, | |||||
| longitude: addressDetail.longitude | |||||
| } | |||||
| if (addressDetail.id) { | |||||
| data.id = addressDetail.id | |||||
| } | |||||
| this.$api(data.id ? 'editAddress' : 'addAddress', 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('editAddress', { | |||||
| id: id, | |||||
| defaultFlag: 1 | |||||
| }, res => { | |||||
| if (res.code == 200) { | |||||
| this.$refs.addressPopup.close() | |||||
| this.getAddressList() | |||||
| uni.showToast({ | |||||
| title: '操作成功', | |||||
| icon: 'none' | |||||
| }) | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //删除地址 | |||||
| deleteAddress(id) { | |||||
| let self = this | |||||
| uni.showModal({ | |||||
| title: this.$t('components.deleteAddress'), | |||||
| content: this.$t('components.confirmDeleteAddress'), | |||||
| success(e) { | |||||
| if (e.confirm) { | |||||
| self.$api('editAddress', { | |||||
| id: id, | |||||
| isDisable: 1, | |||||
| defaultFlag: 0 | |||||
| }, res => { | |||||
| if (res.code == 200) { | |||||
| self.getAddressList() | |||||
| uni.showToast({ | |||||
| title: this.$t('components.deleteSuccessful'), | |||||
| icon: 'none' | |||||
| }) | |||||
| } | |||||
| }) | |||||
| } | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //点击新增按钮 | |||||
| addBtn() { | |||||
| this.title = '新增地址' | |||||
| this.$refs.addressPopup.open({ //初始化数据 | |||||
| name: '', | |||||
| phone: '', | |||||
| address: '', | |||||
| addressDetail: '', | |||||
| defaultFlag: '0', | |||||
| latitude: '', | |||||
| longitude: '' | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style lang="scss" scoped> | <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; | |||||
| } | |||||
| .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> | </style> | ||||
+ 224
- 225
pages_order/components/address/addressList.vue
View File
| @ -1,233 +1,232 @@ | |||||
| <template> | <template> | ||||
| <scroll-view :style="{height: height}" scroll-y="true" @scrolltolower="moreAddress"> | |||||
| <uv-radio-group v-if="addressList.length > 0" v-model="selectAddress" @change="editDefault"> | |||||
| <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 mode="aspectFill" src="/static/image/address/icon.png"></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.id == selectAddress" class="is-default">默认</text> | |||||
| </view> | |||||
| <view class="address-detail"> | |||||
| {{ item.address + " " + item.addressDetail }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view v-if="item.defaultFlag=1" class="controls"> | |||||
| <view class="default-checkbox" @click="editDefault(item.id)"> | |||||
| <uv-radio :name="item.id" icon-size="30rpx" label-disabled size="30rpx"> | |||||
| 默认地址 | |||||
| </uv-radio> | |||||
| </view> | |||||
| <view class="edit-btn"> | |||||
| <uv-icon name="edit-pen"></uv-icon> | |||||
| <text class="control-title" @click="editAddress(item)">编辑</text> | |||||
| </view> | |||||
| <view class="del-btn" @click="deleteAddress(item.id)"> | |||||
| <uv-icon name="trash"></uv-icon> | |||||
| <text class="control-title">删除</text> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </uv-radio-group> | |||||
| <view v-else style="padding: 100rpx 0;"> | |||||
| <uv-empty iconSize="100rpx" mode="history" textSize="28rpx"/> | |||||
| </view> | |||||
| </scroll-view> | |||||
| <scroll-view :style="{height: height}" scroll-y="true" @scrolltolower="moreAddress"> | |||||
| <uv-radio-group v-if="addressList.length > 0" v-model="selectAddress" @change="editDefault"> | |||||
| <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 mode="aspectFill" src="/static/image/address/icon.png"></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 v-if="controls" class="controls"> | |||||
| <view class="default-checkbox" @click="editDefault(item.id)"> | |||||
| <uv-radio :name="item.id" icon-size="30rpx" label-disabled size="30rpx"> | |||||
| 默认地址 | |||||
| </uv-radio> | |||||
| </view> | |||||
| <view class="edit-btn"> | |||||
| <uv-icon name="edit-pen"></uv-icon> | |||||
| <text class="control-title" @click="editAddress(item)">编辑</text> | |||||
| </view> | |||||
| <view class="del-btn" @click="deleteAddress(item.id)"> | |||||
| <uv-icon name="trash"></uv-icon> | |||||
| <text class="control-title">删除</text> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </uv-radio-group> | |||||
| <view v-else style="padding: 100rpx 0;"> | |||||
| <uv-empty iconSize="100rpx" mode="history" textSize="28rpx" /> | |||||
| </view> | |||||
| </scroll-view> | |||||
| </template> | </template> | ||||
| <script> | <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, | |||||
| } | |||||
| }, | |||||
| created() { | |||||
| }, | |||||
| methods: { | |||||
| //获取地址列表 | |||||
| getAddressList() { | |||||
| return new Promise((success, fail) => { | |||||
| this.$api('addressList', this.queryParams, res => { | |||||
| if (res.code == 200) { | |||||
| console.log("res.result.records", res.result.records) | |||||
| this.addressList = res.result.records || []; | |||||
| this.total = res.result.total || 0; | |||||
| this.addressList.forEach(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) | |||||
| }, | |||||
| } | |||||
| } | |||||
| 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, | |||||
| } | |||||
| }, | |||||
| created() {}, | |||||
| methods: { | |||||
| //获取地址列表 | |||||
| getAddressList() { | |||||
| return new Promise((success, fail) => { | |||||
| this.$api('addressList', this.queryParams, res => { | |||||
| if (res.code == 200) { | |||||
| this.addressList = res.result.records || []; | |||||
| this.total = res.result.total || 0; | |||||
| res.result.records.forEach(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) { | |||||
| console.log(e.defaultFlag); | |||||
| this.$emit('editAddress', e) | |||||
| }, | |||||
| // 切换默认地址 | |||||
| editDefault(e) { | |||||
| this.$emit('editDefault', e) | |||||
| }, | |||||
| // 选择了地址 | |||||
| select(e) { | |||||
| this.$emit('select', e) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <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; | |||||
| } | |||||
| } | |||||
| } | |||||
| .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> | </style> | ||||
+ 215
- 215
pages_order/components/address/redactAddress.vue
View File
| @ -1,223 +1,223 @@ | |||||
| <template> | <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> | |||||
| <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> | </template> | ||||
| <script> | <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 = '' //用户啥都没选就点击勾选 | |||||
| }, | |||||
| } | |||||
| } | |||||
| 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> | </script> | ||||
| <style lang="scss" scoped> | <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; | |||||
| } | |||||
| } | |||||
| .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> | </style> | ||||