Commit 314e0846 authored by jyx's avatar jyx

代码优化

parent f7d38554
......@@ -179,7 +179,7 @@ export default {
if (fail) {
fail(res.data.message);
}
message.notify(res.data.message);
// message.notify(res.data.message);
break;
}
},
......
......@@ -4,8 +4,8 @@
<view class="label-wrap">
<view class="str">{{strInfo}}</view>
<view class="str2 mt-30" @click="open1">{{strLabel1}}</view>
<view class="str2 mt-10" @click="open2">{{strLabel2}}</view>
<view class="str2 mt-30" @click="openGuide">{{strLabel1}}</view>
<view class="str2 mt-10" @click="openRefund">{{strLabel2}}</view>
<view class="str2 mt-10" @click="callPhone">{{strLabel3}}</view>
</view>
......@@ -14,7 +14,7 @@
<swiper class="swiper-wrap" :duration="1000" @change="changeGuide" :current="curGuideIndex">
<swiper-item v-for="(item,index) in guideImgs" :key="index">
<view class="swiper-item">
<image :src="item" mode="aspectFill" class=""></image>
<image :src="item" mode="scaleToFill" class="image"></image>
</view>
</swiper-item>
</swiper>
......@@ -25,7 +25,7 @@
<uni-popup class="popup" ref="popup2" type="center">
<view class="pop-wrap" style="justify-content:flex-start">
<view style="margin-left: auto;" @click="closeDialog2">
<view style="margin-left: auto;" @click="closeRefund">
<icon size="30" type="clear"></icon>
</view>
<view class="refund-wrap flex1 mt-30">
......@@ -34,14 +34,14 @@
</view>
<input v-model="alipayOrder" class="input mt-30" type="number" placeholder="请输入支付宝订单号" />
<text class="guide-text" style="margin-top: 30rpx;" @click="open3">立即退款</text>
<text class="guide-text" style="margin-top: 30rpx;" @click="openTip">立即退款</text>
</view>
</view>
</uni-popup>
<uni-popup class="popup2" ref="popup3" type="center">
<uni-popup-dialog title="\n是否确定要退款?" :duration="2000" :before-close="true" @close="closeDialog3"
@confirm="confirm"></uni-popup-dialog>
<uni-popup-dialog :style="{color:refundColor}" :title="refundResult" :duration="2000"
:showClose="showTipColse" @close="closeTip" @confirm="confirm"></uni-popup-dialog>
</uni-popup>
</view>
</template>
......@@ -66,11 +66,16 @@
strLabel2: "2.一键退款",
strLabel3: "3.客服电话",
guideImgs: [
"",
"",
""
"https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay1.png",
"https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay2.png",
"https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay3.png",
"https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay4.png",
"https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay5.png"
],
refundImg: '',
refundResult: '\n是否确定要退款?',
refundColor: "#909399",
showTipColse: true,
guideText: "下一步",
curGuideIndex: 0
};
......@@ -78,7 +83,12 @@
methods: {
handleRefund() {
if (!this.alipayOrder) {
message.notify('请输入支付宝订单号');
setTimeout(() => {
this.refundResult = '\n请输入支付宝订单号'
this.showTipColse = false
this.refundColor = '#f56c6c'
this.openTip()
}, 500)
return;
}
......@@ -91,12 +101,19 @@
success: ({
data
}) => {
that.closeDialog2()
// message.notify(data.msg)
that.closeRefund()
that.refundResult = data.message
that.showTipColse = false
that.refundColor = '#09bb07'
that.openTip()
},
fail: () => {
that.closeDialog2()
message.notify("网络出小差了~")
fail: (e) => {
that.closeRefund()
that.refundResult = '\n' + e
that.showTipColse = false
that.refundColor = '#f56c6c'
that.openTip()
// message.notify("网络出小差了~")
}
});
},
......@@ -113,8 +130,6 @@
},
changeGuide(e) {
this.curGuideIndex = e.detail.current
console.log("sssssss", this.curGuideIndex)
console.log("sssssss-", this.guideImgs.length)
if (this.curGuideIndex >= this.guideImgs.length - 1) {
this.guideText = "我知道了"
} else {
......@@ -123,7 +138,7 @@
},
clickGuide() {
if (this.curGuideIndex >= this.guideImgs.length - 1) {
this.closeDialog1()
this.closeGuide()
} else {
if (++this.curGuideIndex >= this.guideImgs.length - 1) {
this.guideText = "我知道了"
......@@ -132,16 +147,18 @@
}
}
},
open1() {
openGuide() {
// APP退款引导
this.$refs.popup1.open()
},
open2() {
openRefund() {
// 退款
this.$refs.popup2.open()
},
open3() {
openTip() {
this.$refs.popup3.open()
},
closeDialog1() {
closeGuide() {
setTimeout(() => {
this.curGuideIndex = 0
this.guideText = "下一步"
......@@ -149,14 +166,23 @@
this.$refs.popup1.close()
},
closeDialog2() {
closeRefund() {
this.$refs.popup2.close()
},
closeDialog3() {
closeTip() {
this.$refs.popup3.close()
},
confirm() {
this.closeDialog3()
this.closeTip()
if (!this.showTipColse) {
setTimeout(() => {
this.refundResult = '\n是否确定要退款?'
this.showTipColse = true
}, 500)
return
}
this.handleRefund()
}
}
......@@ -258,10 +284,13 @@
height: 800rpx;
width: 80%;
text-align: center;
.image {
width: 100%;
height: 100%;
}
}
}
}
......@@ -277,6 +306,16 @@
border-radius: 8rpx;
}
.success-text {
color: #09bb07;
}
.warn-text {
color: #e6a23c;
}
.error-text {
color: #f56c6c;
}
}
</style>
\ No newline at end of file
## 1.9.5(2024-10-15)
- 修复 微信小程序中的getSystemInfo警告
## 1.9.4(2024-10-12)
- 修复 微信小程序中的getSystemInfo警告
## 1.9.3(2024-10-12)
- 修复 微信小程序中的getSystemInfo警告
## 1.9.2(2024-09-21)
- 修复 uni-popup在android上的重复点击弹出位置不正确的bug
## 1.9.1(2024-04-02)
- 修复 uni-popup-dialog vue3下使用value无法进行绑定的bug(双向绑定兼容旧写法)
## 1.9.0(2024-03-28)
- 修复 uni-popup-dialog 双向绑定时初始化逻辑修正
## 1.8.9(2024-03-20)
- 修复 uni-popup-dialog 数据输入时修正为双向绑定
## 1.8.8(2024-02-20)
- 修复 uni-popup 在微信小程序下出现文字向上闪动的bug
## 1.8.7(2024-02-02)
- 新增 uni-popup-dialog 新增属性focus:input模式下,是否自动自动聚焦
## 1.8.6(2024-01-30)
- 新增 uni-popup-dialog 新增属性maxLength:限制输入框字数
## 1.8.5(2024-01-26)
- 新增 uni-popup-dialog 新增属性showClose:控制关闭按钮的显示
## 1.8.4(2023-11-15)
- 新增 uni-popup 支持uni-app-x 注意暂时仅支持 `maskClick` `@open` `@close`
## 1.8.3(2023-04-17)
- 修复 uni-popup 重复打开时的 bug
## 1.8.2(2023-02-02)
- uni-popup-dialog 组件新增 inputType 属性
## 1.8.1(2022-12-01)
- 修复 nvue 下 v-show 报错
## 1.8.0(2022-11-29)
- 优化 主题样式
## 1.7.9(2022-04-02)
- 修复 弹出层内部无法滚动的bug
## 1.7.8(2022-03-28)
......
......@@ -10,14 +10,15 @@
</view>
<view v-else class="uni-dialog-content">
<slot>
<input class="uni-dialog-input" v-model="val" type="text" :placeholder="placeholderText" :focus="focus" >
<input class="uni-dialog-input" :maxlength="maxlength" v-model="val" :type="inputType"
:placeholder="placeholderText" :focus="focus">
</slot>
</view>
<view class="uni-dialog-button-group">
<view class="uni-dialog-button" @click="closeDialog">
<view class="uni-dialog-button" v-if="showClose" @click="closeDialog">
<text class="uni-dialog-button-text">{{closeText}}</text>
</view>
<view class="uni-dialog-button uni-border-left" @click="onOk">
<view class="uni-dialog-button" :class="showClose?'uni-border-left':''" @click="onOk">
<text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
</view>
</view>
......@@ -31,13 +32,16 @@
initVueI18n
} from '@dcloudio/uni-i18n'
import messages from '../uni-popup/i18n/index.js'
const { t } = initVueI18n(messages)
const {
t
} = initVueI18n(messages)
/**
* PopUp 弹出层-对话框样式
* @description 弹出层-对话框样式
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} value input 模式下的默认值
* @property {String} placeholder input 模式下输入提示
* @property {Boolean} focus input模式下是否自动聚焦,默认为true
* @property {String} type = [success|warning|info|error] 主题样式
* @value success 成功
* @value warning 提示
......@@ -46,8 +50,10 @@
* @property {String} mode = [base|input] 模式、
* @value base 基础对话框
* @value input 可输入对话框
* @showClose {Boolean} 是否显示关闭按钮
* @property {String} content 对话框内容
* @property {Boolean} beforeClose 是否拦截取消事件
* @property {Number} maxlength 输入
* @event {Function} confirm 点击确认按钮触发
* @event {Function} close 点击取消按钮触发
*/
......@@ -55,12 +61,30 @@
export default {
name: "uniPopupDialog",
mixins: [popup],
emits:['confirm','close'],
emits: ['confirm', 'close', 'update:modelValue', 'input'],
props: {
inputType: {
type: String,
default: 'text'
},
showClose: {
type: Boolean,
default: true
},
// #ifdef VUE2
value: {
type: [String, Number],
default: ''
},
// #endif
// #ifdef VUE3
modelValue: {
type: [Number, String],
default: ''
},
// #endif
placeholder: {
type: [String, Number],
default: ''
......@@ -85,19 +109,26 @@
type: Boolean,
default: false
},
cancelText:{
cancelText: {
type: String,
default: ''
},
confirmText:{
confirmText: {
type: String,
default: ''
},
maxlength: {
type: Number,
default: -1,
},
focus: {
type: Boolean,
default: true,
}
},
data() {
return {
dialogType: 'error',
focus: false,
val: ""
}
},
......@@ -125,34 +156,48 @@
}
},
value(val) {
if (this.maxlength != -1 && this.mode === 'input') {
this.val = val.slice(0, this.maxlength);
} else {
this.val = val
}
},
val(val) {
// #ifdef VUE2
// TODO 兼容 vue2
this.$emit('input', val);
// #endif
// #ifdef VUE3
// TODO 兼容 vue3
this.$emit('update:modelValue', val);
// #endif
}
},
created() {
// 对话框遮罩不可点击
this.popup.disableMask()
// this.popup.closeMask()
if (this.mode === 'input') {
this.dialogType = 'info'
this.val = this.value
this.val = this.value;
// #ifdef VUE3
this.val = this.modelValue;
// #endif
} else {
this.dialogType = this.type
}
},
mounted() {
this.focus = true
},
methods: {
/**
* 点击确认按钮
*/
onOk() {
if (this.mode === 'input'){
if (this.mode === 'input') {
this.$emit('confirm', this.val)
}else{
} else {
this.$emit('confirm')
}
if(this.beforeClose) return
if (this.beforeClose) return
this.popup.close()
},
/**
......@@ -160,17 +205,17 @@
*/
closeDialog() {
this.$emit('close')
if(this.beforeClose) return
if (this.beforeClose) return
this.popup.close()
},
close(){
close() {
this.popup.close()
}
}
}
</script>
<style lang="scss" >
<style lang="scss">
.uni-popup-dialog {
width: 300px;
border-radius: 11px;
......@@ -187,6 +232,9 @@
}
.uni-dialog-title-text {
padding: 0 10px;
line-height: 26px;
text-align: center;
font-size: 16px;
font-weight: 500;
}
......
......@@ -47,7 +47,7 @@
{
text: '支付宝',
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/d684ae40-50be-11eb-8ff1-d5dcf8779628.png',
name: 'wx'
name: 'ali'
},
{
text: 'QQ',
......
......@@ -5,7 +5,7 @@
:duration="duration" :show="showTrans" @click="onTap" />
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration"
:show="showTrans" @click="onTap">
<view class="uni-popup__wrapper" :style="{ backgroundColor: bg }" :class="[popupstyle]" @click="clear">
<view class="uni-popup__wrapper" :style="getStyles" :class="[popupstyle]" @click="clear">
<slot />
</view>
</uni-transition>
......@@ -39,6 +39,7 @@
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
* @property {String} backgroundColor 主窗口背景色
* @property {String} maskBackgroundColor 蒙版颜色
* @property {String} borderRadius 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"
* @property {Boolean} safeArea 是否适配底部安全区
* @event {Function} change 打开关闭弹窗触发,e={show: false}
* @event {Function} maskClick 点击遮罩触发
......@@ -86,6 +87,9 @@
type: String,
default: 'rgba(0, 0, 0, 0.4)'
},
borderRadius:{
type: String,
}
},
watch: {
......@@ -157,16 +161,25 @@
backgroundColor: 'rgba(0, 0, 0, 0.4)'
},
transClass: {
backgroundColor: 'transparent',
borderRadius: this.borderRadius || "0",
position: 'fixed',
left: 0,
right: 0
},
maskShow: true,
mkclick: true,
popupstyle: this.isDesktop ? 'fixforpc-top' : 'top'
popupstyle: 'top'
}
},
computed: {
getStyles() {
let res = { backgroundColor: this.bg };
if (this.borderRadius || "0") {
res = Object.assign(res, { borderRadius: this.borderRadius })
}
return res;
},
isDesktop() {
return this.popupWidth >= 500 && this.popupHeight >= 500
},
......@@ -179,6 +192,17 @@
},
mounted() {
const fixSize = () => {
// #ifdef MP-WEIXIN
const {
windowWidth,
windowHeight,
windowTop,
safeArea,
screenHeight,
safeAreaInsets
} = uni.getWindowInfo()
// #endif
// #ifndef MP-WEIXIN
const {
windowWidth,
windowHeight,
......@@ -187,6 +211,7 @@
screenHeight,
safeAreaInsets
} = uni.getSystemInfoSync()
// #endif
this.popupWidth = windowWidth
this.popupHeight = windowHeight + (windowTop || 0)
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异,需要框架修复
......@@ -221,6 +246,12 @@
this.setH5Visible()
},
// #endif
activated() {
this.setH5Visible(!this.showPopup);
},
deactivated() {
this.setH5Visible(true);
},
created() {
// this.mkclick = this.isMaskClick || this.maskClick
if (this.isMaskClick === null && this.maskClick === null) {
......@@ -240,10 +271,10 @@
this.maskClass.backgroundColor = this.maskBackgroundColor
},
methods: {
setH5Visible() {
setH5Visible(visible = true) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = 'visible'
document.getElementsByTagName('body')[0].style.overflow = visible ? "visible" : "hidden";
// #endif
},
/**
......@@ -269,8 +300,7 @@
open(direction) {
// fix by mehaotian 处理快速打开关闭的情况
if (this.showPopup) {
clearTimeout(this.timer)
this.showPopup = false
return
}
let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share']
if (!(direction && innerType.indexOf(direction) !== -1)) {
......@@ -324,13 +354,15 @@
position: 'fixed',
left: 0,
right: 0,
backgroundColor: this.bg
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ,后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.$nextTick(() => {
this.showPoptrans()
if (this.messageChild && this.type === 'message') {
this.messageChild.timerClose()
}
......@@ -348,19 +380,25 @@
right: 0,
bottom: 0,
paddingBottom: this.safeAreaInsets + 'px',
backgroundColor: this.bg
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
}
// TODO 兼容 type 属性 ,后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.showPoptrans()
},
/**
* 中间弹出样式处理
*/
center(type) {
this.popupstyle = 'center'
//微信小程序下,组合动画会出现文字向上闪动问题,再此做特殊处理
// #ifdef MP-WEIXIN
this.ani = ['fade']
// #endif
// #ifndef MP-WEIXIN
this.ani = ['zoom-out', 'fade']
// #endif
this.transClass = {
position: 'fixed',
/* #ifndef APP-NVUE */
......@@ -372,12 +410,12 @@
right: 0,
top: 0,
justifyContent: 'center',
alignItems: 'center'
alignItems: 'center',
borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ,后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.showPoptrans()
},
left(type) {
this.popupstyle = 'left'
......@@ -388,6 +426,7 @@
bottom: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
......@@ -395,8 +434,7 @@
}
// TODO 兼容 type 属性 ,后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.showPoptrans()
},
right(type) {
this.popupstyle = 'right'
......@@ -407,6 +445,7 @@
right: 0,
top: 0,
backgroundColor: this.bg,
borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
......@@ -414,8 +453,13 @@
}
// TODO 兼容 type 属性 ,后续会废弃
if (type) return
this.showPoptrans()
},
showPoptrans(){
this.$nextTick(()=>{
this.showPopup = true
this.showTrans = true
})
}
}
}
......
{
"id": "uni-popup",
"displayName": "uni-popup 弹出层",
"version": "1.7.9",
"version": "1.9.5",
"description": " Popup 组件,提供常用的弹层",
"keywords": [
"uni-ui",
......@@ -18,10 +18,6 @@
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
......@@ -38,7 +34,8 @@
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
......@@ -49,7 +46,8 @@
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
......
## 1.3.3(2024-04-23)
- 修复 当元素会受变量影响自动隐藏的bug
## 1.3.2(2023-05-04)
- 修复 NVUE 平台报错的问题
## 1.3.1(2021-11-23)
- 修复 init 方法初始化问题
## 1.3.0(2021-11-19)
......
......@@ -10,7 +10,10 @@ const nvueAnimation = uni.requireNativePlugin('animation')
class MPAnimation {
constructor(options, _this) {
this.options = options
this.animation = uni.createAnimation(options)
// 在iOS10+QQ小程序平台下,传给原生的对象一定是个普通对象而不是Proxy对象,否则会报parameter should be Object instead of ProxyObject的错误
this.animation = uni.createAnimation({
...options
})
this.currentStepAnimates = {}
this.next = 0
this.$ = _this
......
<template>
<!-- #ifndef APP-NVUE -->
<view v-show="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
</template>
<script>
......@@ -48,7 +53,11 @@ export default {
customClass:{
type: String,
default: ''
}
},
onceRender:{
type:Boolean,
default:false
},
},
data() {
return {
......@@ -245,7 +254,7 @@ export default {
},
animationType(type) {
return {
fade: type ? 1 : 0,
fade: type ? 0 : 1,
'slide-top': `translateY(${type ? '0' : '-100%'})`,
'slide-right': `translateX(${type ? '0' : '100%'})`,
'slide-bottom': `translateY(${type ? '0' : '100%'})`,
......
......@@ -21147,7 +21147,7 @@ var _default = {
if (_fail) {
_fail(res.data.message);
}
_fun.message.notify(res.data.message);
// message.notify(res.data.message);
break;
}
},
......
......@@ -314,6 +314,10 @@
width: 80%;
text-align: center;
}
.body .pop-wrap .swiper-wrap .swiper-item .image {
width: 100%;
height: 100%;
}
.body .guide-text {
text-align: center;
margin-top: 100rpx;
......@@ -325,4 +329,13 @@
background: #3881F3;
border-radius: 8rpx;
}
.body .success-text {
color: #09bb07;
}
.body .warn-text {
color: #e6a23c;
}
.body .error-text {
color: #f56c6c;
}
<view class="body login" style="{{('padding-bottom:'+bottomSafePadding+'px;')}}"><view class="label-wrap"><view class="str">{{strInfo}}</view><view data-event-opts="{{[['tap',[['open1',['$event']]]]]}}" class="str2 mt-30" onTap="__e">{{strLabel1}}</view><view data-event-opts="{{[['tap',[['open2',['$event']]]]]}}" class="str2 mt-10" onTap="__e">{{strLabel2}}</view><view data-event-opts="{{[['tap',[['callPhone',['$event']]]]]}}" class="str2 mt-10" onTap="__e">{{strLabel3}}</view></view><uni-popup class="popup" vue-id="79877a54-1" type="dialog" ref="__r" data-ref="popup1" onVueInit="__l" vue-slots="{{['default']}}"><view class="pop-wrap"><swiper class="swiper-wrap" duration="{{1000}}" current="{{curGuideIndex}}" data-event-opts="{{[['change',[['changeGuide',['$event']]]]]}}" onChange="__e"><swiper-item a:for="{{guideImgs}}" a:for-item="item" a:for-index="index" a:key="index"><view class="swiper-item"><image src="{{item}}" mode="aspectFill"></image></view></swiper-item></swiper><text data-event-opts="{{[['tap',[['clickGuide',['$event']]]]]}}" class="guide-text" onTap="__e">{{guideText}}</text></view></uni-popup><uni-popup class="popup" vue-id="79877a54-2" type="center" ref="__r" data-ref="popup2" onVueInit="__l" vue-slots="{{['default']}}"><view class="pop-wrap" style="justify-content:flex-start;"><view data-event-opts="{{[['tap',[['closeDialog2',['$event']]]]]}}" style="margin-left:auto;" onTap="__e"><icon size="30" type="clear"></icon></view><view class="refund-wrap flex1 mt-30"><view class="image-wrap"><image class="image" src="{{refundImg}}" mode="aspectFill"></image></view><input class="input mt-30" type="number" placeholder="请输入支付宝订单号" data-event-opts="{{[['input',[['__set_model',['','alipayOrder','$event',[]]]]]]}}" value="{{alipayOrder}}" onInput="__e"/><text data-event-opts="{{[['tap',[['open3',['$event']]]]]}}" class="guide-text" style="margin-top:30rpx;" onTap="__e">立即退款</text></view></view></uni-popup><uni-popup class="popup2" vue-id="79877a54-3" type="center" ref="__r" data-ref="popup3" onVueInit="__l" vue-slots="{{['default']}}"><uni-popup-dialog vue-id="{{('79877a54-4')+','+('79877a54-3')}}" title="\n是否确定要退款?" duration="{{2000}}" before-close="{{true}}" data-event-opts="{{[['^close',[['closeDialog3']]],['^confirm',[['confirm']]]]}}" onClose="__e" onConfirm="__e" onVueInit="__l"></uni-popup-dialog></uni-popup></view>
\ No newline at end of file
<view class="body login" style="{{('padding-bottom:'+bottomSafePadding+'px;')}}"><view class="label-wrap"><view class="str">{{strInfo}}</view><view data-event-opts="{{[['tap',[['openGuide',['$event']]]]]}}" class="str2 mt-30" onTap="__e">{{strLabel1}}</view><view data-event-opts="{{[['tap',[['openRefund',['$event']]]]]}}" class="str2 mt-10" onTap="__e">{{strLabel2}}</view><view data-event-opts="{{[['tap',[['callPhone',['$event']]]]]}}" class="str2 mt-10" onTap="__e">{{strLabel3}}</view></view><uni-popup class="popup" vue-id="79877a54-1" type="dialog" ref="__r" data-ref="popup1" onVueInit="__l" vue-slots="{{['default']}}"><view class="pop-wrap"><swiper class="swiper-wrap" duration="{{1000}}" current="{{curGuideIndex}}" data-event-opts="{{[['change',[['changeGuide',['$event']]]]]}}" onChange="__e"><swiper-item a:for="{{guideImgs}}" a:for-item="item" a:for-index="index" a:key="index"><view class="swiper-item"><image class="image" src="{{item}}" mode="scaleToFill"></image></view></swiper-item></swiper><text data-event-opts="{{[['tap',[['clickGuide',['$event']]]]]}}" class="guide-text" onTap="__e">{{guideText}}</text></view></uni-popup><uni-popup class="popup" vue-id="79877a54-2" type="center" ref="__r" data-ref="popup2" onVueInit="__l" vue-slots="{{['default']}}"><view class="pop-wrap" style="justify-content:flex-start;"><view data-event-opts="{{[['tap',[['closeRefund',['$event']]]]]}}" style="margin-left:auto;" onTap="__e"><icon size="30" type="clear"></icon></view><view class="refund-wrap flex1 mt-30"><view class="image-wrap"><image class="image" src="{{refundImg}}" mode="aspectFill"></image></view><input class="input mt-30" type="number" placeholder="请输入支付宝订单号" data-event-opts="{{[['input',[['__set_model',['','alipayOrder','$event',[]]]]]]}}" value="{{alipayOrder}}" onInput="__e"/><text data-event-opts="{{[['tap',[['openTip',['$event']]]]]}}" class="guide-text" style="margin-top:30rpx;" onTap="__e">立即退款</text></view></view></uni-popup><uni-popup class="popup2" vue-id="79877a54-3" type="center" ref="__r" data-ref="popup3" onVueInit="__l" vue-slots="{{['default']}}"><uni-popup-dialog style="{{'color:'+(refundColor)+';'}}" vue-id="{{('79877a54-4')+','+('79877a54-3')}}" title="{{refundResult}}" duration="{{2000}}" showClose="{{showTipColse}}" data-event-opts="{{[['^close',[['closeTip']]],['^confirm',[['confirm']]]]}}" onClose="__e" onConfirm="__e" onVueInit="__l"></uni-popup-dialog></uni-popup></view>
\ No newline at end of file
......@@ -232,16 +232,25 @@ var _default = {
strLabel1: "1.自动续费如何关闭",
strLabel2: "2.一键退款",
strLabel3: "3.客服电话",
guideImgs: ["", "", ""],
guideImgs: ["https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay1.png", "https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay2.png", "https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay3.png", "https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay4.png", "https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_guide_alipay5.png"],
refundImg: '',
refundResult: '\n是否确定要退款?',
refundColor: "#909399",
showTipColse: true,
guideText: "下一步",
curGuideIndex: 0
};
},
methods: {
handleRefund: function handleRefund() {
var _this = this;
if (!this.alipayOrder) {
_fun.message.notify('请输入支付宝订单号');
setTimeout(function () {
_this.refundResult = '\n请输入支付宝订单号';
_this.showTipColse = false;
_this.refundColor = '#f56c6c';
_this.openTip();
}, 500);
return;
}
var that = this;
......@@ -252,13 +261,19 @@ var _default = {
},
success: function success(_ref) {
var data = _ref.data;
that.closeDialog2();
// message.notify(data.msg)
that.closeRefund();
that.refundResult = data.message;
that.showTipColse = false;
that.refundColor = '#09bb07';
that.openTip();
},
fail: function fail() {
that.closeDialog2();
_fun.message.notify("网络出小差了~");
fail: function fail(e) {
that.closeRefund();
that.refundResult = '\n' + e;
that.showTipColse = false;
that.refundColor = '#f56c6c';
that.openTip();
// message.notify("网络出小差了~")
}
});
},
......@@ -275,8 +290,6 @@ var _default = {
},
changeGuide: function changeGuide(e) {
this.curGuideIndex = e.detail.current;
console.log("sssssss", this.curGuideIndex);
console.log("sssssss-", this.guideImgs.length);
if (this.curGuideIndex >= this.guideImgs.length - 1) {
this.guideText = "我知道了";
} else {
......@@ -285,7 +298,7 @@ var _default = {
},
clickGuide: function clickGuide() {
if (this.curGuideIndex >= this.guideImgs.length - 1) {
this.closeDialog1();
this.closeGuide();
} else {
if (++this.curGuideIndex >= this.guideImgs.length - 1) {
this.guideText = "我知道了";
......@@ -294,31 +307,41 @@ var _default = {
}
}
},
open1: function open1() {
openGuide: function openGuide() {
// APP退款引导
this.$refs.popup1.open();
},
open2: function open2() {
openRefund: function openRefund() {
// 退款
this.$refs.popup2.open();
},
open3: function open3() {
openTip: function openTip() {
this.$refs.popup3.open();
},
closeDialog1: function closeDialog1() {
var _this = this;
closeGuide: function closeGuide() {
var _this2 = this;
setTimeout(function () {
_this.curGuideIndex = 0;
_this.guideText = "下一步";
_this2.curGuideIndex = 0;
_this2.guideText = "下一步";
}, 500);
this.$refs.popup1.close();
},
closeDialog2: function closeDialog2() {
closeRefund: function closeRefund() {
this.$refs.popup2.close();
},
closeDialog3: function closeDialog3() {
closeTip: function closeTip() {
this.$refs.popup3.close();
},
confirm: function confirm() {
this.closeDialog3();
var _this3 = this;
this.closeTip();
if (!this.showTipColse) {
setTimeout(function () {
_this3.refundResult = '\n是否确定要退款?';
_this3.showTipColse = true;
}, 500);
return;
}
this.handleRefund();
}
}
......
......@@ -245,6 +245,9 @@
padding-top: 25px;
}
.uni-dialog-title-text {
padding: 0 10px;
line-height: 26px;
text-align: center;
font-size: 16px;
font-weight: 500;
}
......
<view class="uni-popup-dialog"><view class="uni-dialog-title"><text class="{{(('uni-dialog-title-text')+' '+('uni-popup__'+dialogType))}}">{{titleText}}</text></view><block a:if="{{mode==='base'}}"><view class="uni-dialog-content"><block a:if="{{$slots.$default}}"><slot></slot></block><block a:else><text class="uni-dialog-content-text">{{content}}</text></block></view></block><block a:else><view class="uni-dialog-content"><block a:if="{{$slots.$default}}"><slot></slot></block><block a:else><input class="uni-dialog-input" type="text" placeholder="{{placeholderText}}" focus="{{focus}}" data-event-opts="{{[['input',[['__set_model',['','val','$event',[]]]]]]}}" value="{{val}}" onInput="__e"/></block></view></block><view class="uni-dialog-button-group"><view data-event-opts="{{[['tap',[['closeDialog',['$event']]]]]}}" class="uni-dialog-button" onTap="__e"><text class="uni-dialog-button-text">{{closeText}}</text></view><view data-event-opts="{{[['tap',[['onOk',['$event']]]]]}}" class="uni-dialog-button uni-border-left" onTap="__e"><text class="uni-dialog-button-text uni-button-color">{{okText}}</text></view></view></view>
\ No newline at end of file
<view class="uni-popup-dialog"><view class="uni-dialog-title"><text class="{{(('uni-dialog-title-text')+' '+('uni-popup__'+dialogType))}}">{{titleText}}</text></view><block a:if="{{mode==='base'}}"><view class="uni-dialog-content"><block a:if="{{$slots.$default}}"><slot></slot></block><block a:else><text class="uni-dialog-content-text">{{content}}</text></block></view></block><block a:else><view class="uni-dialog-content"><block a:if="{{$slots.$default}}"><slot></slot></block><block a:else><input class="uni-dialog-input" maxlength="{{maxlength}}" type="{{inputType}}" placeholder="{{placeholderText}}" focus="{{focus}}" data-event-opts="{{[['input',[['__set_model',['','val','$event',[]]]]]]}}" value="{{val}}" onInput="__e"/></block></view></block><view class="uni-dialog-button-group"><block a:if="{{showClose}}"><view data-event-opts="{{[['tap',[['closeDialog',['$event']]]]]}}" class="uni-dialog-button" onTap="__e"><text class="uni-dialog-button-text">{{closeText}}</text></view></block><view data-event-opts="{{[['tap',[['onOk',['$event']]]]]}}" class="{{(('uni-dialog-button')+' '+(showClose?'uni-border-left':''))}}" onTap="__e"><text class="uni-dialog-button-text uni-button-color">{{okText}}</text></view></view></view>
\ No newline at end of file
......@@ -151,6 +151,7 @@ var _index = _interopRequireDefault(__webpack_require__(/*! ../uni-popup/i18n/in
//
//
//
//
var _initVueI18n = (0, _uniI18n.initVueI18n)(_index.default),
t = _initVueI18n.t;
......@@ -160,6 +161,7 @@ var _initVueI18n = (0, _uniI18n.initVueI18n)(_index.default),
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} value input 模式下的默认值
* @property {String} placeholder input 模式下输入提示
* @property {Boolean} focus input模式下是否自动聚焦,默认为true
* @property {String} type = [success|warning|info|error] 主题样式
* @value success 成功
* @value warning 提示
......@@ -168,16 +170,26 @@ var _initVueI18n = (0, _uniI18n.initVueI18n)(_index.default),
* @property {String} mode = [base|input] 模式、
* @value base 基础对话框
* @value input 可输入对话框
* @showClose {Boolean} 是否显示关闭按钮
* @property {String} content 对话框内容
* @property {Boolean} beforeClose 是否拦截取消事件
* @property {Number} maxlength 输入
* @event {Function} confirm 点击确认按钮触发
* @event {Function} close 点击取消按钮触发
*/
var _default = {
name: "uniPopupDialog",
mixins: [_popup.default],
emits: ['confirm', 'close'],
emits: ['confirm', 'close', 'update:modelValue', 'input'],
props: {
inputType: {
type: String,
default: 'text'
},
showClose: {
type: Boolean,
default: true
},
value: {
type: [String, Number],
default: ''
......@@ -213,12 +225,19 @@ var _default = {
confirmText: {
type: String,
default: ''
},
maxlength: {
type: Number,
default: -1
},
focus: {
type: Boolean,
default: true
}
},
data: function data() {
return {
dialogType: 'error',
focus: false,
val: ""
};
},
......@@ -246,9 +265,17 @@ var _default = {
}
},
value: function value(val) {
if (this.maxlength != -1 && this.mode === 'input') {
this.val = val.slice(0, this.maxlength);
} else {
this.val = val;
}
},
val: function val(_val) {
// TODO 兼容 vue2
this.$emit('input', _val);
}
},
created: function created() {
// 对话框遮罩不可点击
this.popup.disableMask();
......@@ -260,9 +287,6 @@ var _default = {
this.dialogType = this.type;
}
},
mounted: function mounted() {
this.focus = true;
},
methods: {
/**
* 点击确认按钮
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment