12 changed files with 604 additions and 51 deletions
Unified View
Diff Options
-
+169 -0components/config/PrivacyAgreementPoup.vue
-
+3 -5components/config/configPopup.vue
-
+6 -0pages.json
-
+85 -36pages/index/cart.vue
-
+6 -1pages/index/index.vue
-
+153 -0pages_order/auth/wxLogin.vue
-
+133 -0pages_order/auth/wxUserInfo.vue
-
+48 -8pages_order/components/product/submitUnitSelect.vue
-
+1 -1pages_order/order/refundsOrExchange.vue
-
BINpages_order/static/auth/headImage.png
-
BINpages_order/static/auth/wx.png
-
BINstatic/image/PrivacyAgreementPoup/icon.png
+ 169
- 0
components/config/PrivacyAgreementPoup.vue
View File
| @ -0,0 +1,169 @@ | |||||
| <template> | |||||
| <uv-popup ref="popup" z-index="99999" :closeOnClickOverlay="false" :customStyle="{ backgroundColor: 'transparent' }"> | |||||
| <view class="privacyPopup"> | |||||
| <view class="icon"> | |||||
| <image src="/static/image/PrivacyAgreementPoup/icon.png" | |||||
| mode=""></image> | |||||
| </view> | |||||
| <view class="title"> | |||||
| <view>协议与隐私政策</view> | |||||
| </view> | |||||
| <view class="content_pri"> | |||||
| <view class="text"> | |||||
| 欢迎来到酒店布草!我们根据最新的法律法规、监管政策要求，更新了《用户协议》和《隐私政策》,请您认真阅读。 | |||||
| </view> | |||||
| </view> | |||||
| <view class="config"> | |||||
| <uv-checkbox-group v-model="checkboxValue" shape="circle"> | |||||
| <view class="content"> | |||||
| <view style="display: flex;"> | |||||
| <!-- <uv-checkbox size="30rpx" :name="1"></uv-checkbox> --> | |||||
| 同意<text @click="goToPrivacy">《酒店布草隐私政策》</text> | |||||
| </view> | |||||
| <view class=""> | |||||
| 以及<text @click="goToPrivacy">《用户协议》</text> | |||||
| </view> | |||||
| </view> | |||||
| </uv-checkbox-group> | |||||
| </view> | |||||
| <view class="pri_btn"> | |||||
| <button class="confuse_btn" @click="confusePrivacy">拒绝</button> | |||||
| <button | |||||
| class="confirm_btn" id="agree-btn" | |||||
| open-type="agreePrivacyAuthorization" | |||||
| @agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button> | |||||
| </view> | |||||
| </view> | |||||
| </uv-popup> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| name: 'PrivacyAgreementPoup', | |||||
| data() { | |||||
| return { | |||||
| resolvePrivacyAuthorization: {}, | |||||
| checkboxValue : false | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| if(wx.getPrivacySetting){ | |||||
| wx.getPrivacySetting({ | |||||
| success: res => { | |||||
| console.log(res) | |||||
| if (res.needAuthorization) { | |||||
| // 需要弹出隐私协议 | |||||
| this.init() | |||||
| } | |||||
| }, | |||||
| fail: () => {} | |||||
| }) | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| //初始化 | |||||
| init(resolve) { | |||||
| this.$refs.popup.open('center') | |||||
| this.resolvePrivacyAuthorization = resolve | |||||
| }, | |||||
| // 打开隐私协议 | |||||
| goToPrivacy() { | |||||
| wx.openPrivacyContract({ | |||||
| success: () => { | |||||
| console.log('打开成功'); | |||||
| }, // 打开成功 | |||||
| fail: () => { | |||||
| uni.showToast({ | |||||
| title: '打开失败，稍后重试', | |||||
| icon: 'none' | |||||
| }) | |||||
| } // 打开失败 | |||||
| }) | |||||
| }, | |||||
| // 拒绝 | |||||
| confusePrivacy() { | |||||
| this.$refs.popup.close() | |||||
| // this.resolvePrivacyAuthorization({ | |||||
| // event: 'disagree' | |||||
| // }) | |||||
| }, | |||||
| // 同意 | |||||
| handleAgreePrivacyAuthorization() { | |||||
| // 告知平台用户已经同意，参数传同意按钮的id | |||||
| // this.resolvePrivacyAuthorization({ | |||||
| // buttonId: 'agree-btn', | |||||
| // event: 'agree' | |||||
| // }) | |||||
| this.$refs.popup.close() | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| .privacyPopup { | |||||
| width: 90%; | |||||
| margin: 0rpx auto; | |||||
| background: white; | |||||
| border-radius: 20rpx; | |||||
| box-sizing: border-box; | |||||
| padding: 40rpx 30rpx; | |||||
| .icon{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| padding-bottom: 30rpx; | |||||
| image{ | |||||
| width: 90rpx; | |||||
| height: 90rpx; | |||||
| } | |||||
| } | |||||
| .title { | |||||
| text-align: center; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| .content_pri { | |||||
| padding: 30rpx 0rpx; | |||||
| font-size: 28rpx; | |||||
| } | |||||
| .config { | |||||
| font-size: 28rpx; | |||||
| text-align: center; | |||||
| line-height: 40rpx; | |||||
| margin-bottom: 30rpx; | |||||
| text { | |||||
| color: $uni-color; | |||||
| } | |||||
| .content{ | |||||
| display: flex; | |||||
| } | |||||
| } | |||||
| .pri_btn { | |||||
| display: flex; | |||||
| .confuse_btn{ | |||||
| background-color: #F2F2F2; | |||||
| color: #BDBDBD; | |||||
| } | |||||
| button { | |||||
| margin: 10rpx; | |||||
| flex: 1; | |||||
| background: $uni-color; | |||||
| outline: none; | |||||
| color: white; | |||||
| font-size: 30rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 3
- 5
components/config/configPopup.vue
View File
+ 6
- 0
pages.json
View File
+ 85
- 36
pages/index/cart.vue
View File
+ 6
- 1
pages/index/index.vue
View File
+ 153
- 0
pages_order/auth/wxLogin.vue
View File
| @ -0,0 +1,153 @@ | |||||
| <template> | |||||
| <view class="login"> | |||||
| <view class="logo"> | |||||
| <!-- <image src="/static/image/login/logo.png" mode=""></image> --> | |||||
| </view> | |||||
| <view class="title"> | |||||
| 欢迎使用酒店桌布租赁平台 | |||||
| </view> | |||||
| <view class="btn mt" | |||||
| @click="wxLogin"> | |||||
| <view class="icon"> | |||||
| <image src="../static/auth/wx.png" mode=""></image> | |||||
| </view> | |||||
| <view class=""> | |||||
| 微信授权登录 | |||||
| </view> | |||||
| </view> | |||||
| <!-- <view class="btn b2"> | |||||
| 使用短信验证登录 | |||||
| </view> --> | |||||
| <view class="config"> | |||||
| <uv-checkbox-group | |||||
| v-model="checkboxValue" | |||||
| shape="circle"> | |||||
| <view class="content"> | |||||
| <view | |||||
| style="display: flex;"> | |||||
| <uv-checkbox | |||||
| size="40rpx" | |||||
| icon-size="30rpx" | |||||
| activeColor="#FD5100" | |||||
| :name="1" | |||||
| ></uv-checkbox> | |||||
| 阅读并同意我们的<text @click="openConfigDetail('privacyAgreement')">“服务协议与隐私条款”</text> | |||||
| </view> | |||||
| <view class=""> | |||||
| 以及<text @click="openConfigDetail('userAgreement')">个人信息保护指引</text> | |||||
| </view> | |||||
| </view> | |||||
| </uv-checkbox-group> | |||||
| </view> | |||||
| <configPopup ref="popup"></configPopup> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import configPopup from '@/components/config/configPopup.vue'; | |||||
| export default { | |||||
| name : 'Login', | |||||
| data() { | |||||
| return { | |||||
| checkboxValue : [] | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| wxLogin(){ | |||||
| if(!this.checkboxValue.length){ | |||||
| return uni.showToast({ | |||||
| title: '请先同意隐私协议', | |||||
| icon:'none' | |||||
| }) | |||||
| } | |||||
| this.$store.commit('login') | |||||
| }, | |||||
| //打开应用配置 | |||||
| openConfigDetail(key){ | |||||
| this.$refs.popup.open(key) | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .login{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| height: 80vh; | |||||
| flex-direction: column; | |||||
| position: relative; | |||||
| .logo{ | |||||
| height: 140rpx; | |||||
| width: 140rpx; | |||||
| background-color: #ddd; | |||||
| border-radius: 30rpx; | |||||
| image{ | |||||
| width: 80rpx; | |||||
| height: 80rpx; | |||||
| } | |||||
| margin-bottom: 20rpx; | |||||
| } | |||||
| .title{ | |||||
| position: relative; | |||||
| font-weight: 900; | |||||
| font-size: 45rpx; | |||||
| &::after{ | |||||
| content: ''; | |||||
| position: absolute; | |||||
| left: 0; | |||||
| top: 100%; | |||||
| display: block; | |||||
| height: 8rpx; | |||||
| width: 210rpx; | |||||
| background: linear-gradient(to right,$uni-color, #fff); | |||||
| } | |||||
| } | |||||
| .btn{ | |||||
| width: 80%; | |||||
| height: 100rpx; | |||||
| background-color: $uni-color; | |||||
| color: #fff; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| margin: 20rpx 0; | |||||
| border-radius: 20rpx; | |||||
| .icon{ | |||||
| margin-right: 10rpx; | |||||
| image{ | |||||
| width: 40rpx; | |||||
| height: 35rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .b2{ | |||||
| background-color: #3c69f122; | |||||
| color: #3c69f1; | |||||
| } | |||||
| .mt{ | |||||
| margin-top: 200rpx; | |||||
| } | |||||
| .config{ | |||||
| position: absolute; | |||||
| bottom: 0; | |||||
| font-size: 22rpx; | |||||
| text-align: center; | |||||
| line-height: 40rpx; | |||||
| text{ | |||||
| color: $uni-color; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 133
- 0
pages_order/auth/wxUserInfo.vue
View File
| @ -0,0 +1,133 @@ | |||||
| <template> | |||||
| <view class="login"> | |||||
| <view class="title"> | |||||
| 酒店桌布租赁平台 | |||||
| </view> | |||||
| <view class="title"> | |||||
| 申请获取你的头像、昵称 | |||||
| </view> | |||||
| <button class="chooseAvatar" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"> | |||||
| <view class="line"> | |||||
| <view class=""> | |||||
| 头像 | |||||
| </view> | |||||
| <view class=""> | |||||
| <image :src="userInfo.headImage" v-if="userInfo.headImage" style="width: 60rpx;height: 60rpx;" | |||||
| mode=""></image> | |||||
| <image src="../static/auth/headImage.png" v-else style="width: 50rpx;height: 50rpx;" mode=""></image> | |||||
| </view> | |||||
| </view> | |||||
| </button> | |||||
| <view class="line"> | |||||
| <view class=""> | |||||
| 昵称 | |||||
| </view> | |||||
| <view class=""> | |||||
| <input type="nickname" placeholder="请输入昵称" style="text-align: right;" id="nickName" | |||||
| v-model="userInfo.nickName" /> | |||||
| </view> | |||||
| </view> | |||||
| <view class="btn" @click="submit"> | |||||
| 确认 | |||||
| </view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| data() { | |||||
| return { | |||||
| userInfo: { | |||||
| headImage: '', | |||||
| nickName: '', | |||||
| } | |||||
| }; | |||||
| }, | |||||
| onShow() {}, | |||||
| computed: {}, | |||||
| methods: { | |||||
| onChooseAvatar(res) { | |||||
| let self = this | |||||
| self.$Oss.ossUpload(res.target.avatarUrl) | |||||
| .then(url => { | |||||
| self.userInfo.headImage = url | |||||
| }) | |||||
| }, | |||||
| submit() { | |||||
| let self = this | |||||
| uni.createSelectorQuery().in(this) | |||||
| .select("#nickName") | |||||
| .fields({ | |||||
| properties: ["value"], | |||||
| }) | |||||
| .exec((res) => { | |||||
| const nickName = res?.[0]?.value | |||||
| self.userInfo.nickName = nickName | |||||
| if (self.$utils.verificationAll(self.userInfo, { | |||||
| headImage: '请选择头像', | |||||
| nickName: '请填写昵称', | |||||
| })) { | |||||
| return | |||||
| } | |||||
| self.$api('infoUpdateInfo', self.userInfo, res => { | |||||
| if (res.code == 200) { | |||||
| uni.switchTab({ | |||||
| url:'/pages/center/center' | |||||
| }) | |||||
| } | |||||
| }) | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| .login { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| height: 80vh; | |||||
| .title { | |||||
| line-height: 45rpx; | |||||
| font-weight: 900; | |||||
| } | |||||
| .line { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| width: 80%; | |||||
| border-bottom: 1px solid #00000023; | |||||
| padding: 30rpx 0; | |||||
| margin: 0 auto; | |||||
| } | |||||
| .chooseAvatar { | |||||
| width: 100%; | |||||
| padding: 0; | |||||
| margin: 0; | |||||
| margin-top: 10vh; | |||||
| border: none; | |||||
| } | |||||
| .btn { | |||||
| // background: $uni-linear-gradient-btn-color; | |||||
| background: $uni-color; | |||||
| color: #fff; | |||||
| width: 80%; | |||||
| padding: 20rpx 0; | |||||
| text-align: center; | |||||
| border-radius: 15rpx; | |||||
| margin-top: 10vh; | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 48
- 8
pages_order/components/product/submitUnitSelect.vue
View File
+ 1
- 1
pages_order/order/refundsOrExchange.vue
View File
BIN
pages_order/static/auth/headImage.png
View File
| Before | After |
|---|---|
|
|
| Width: 80 | Height: 80 | Size: 1.4 KiB |
BIN
pages_order/static/auth/wx.png
View File
| Before | After |
|---|---|
|
|
| Width: 22 | Height: 18 | Size: 453 B |
BIN
static/image/PrivacyAgreementPoup/icon.png
View File
| Before | After |
|---|---|
|
|
| Width: 39 | Height: 39 | Size: 1007 B |