Commit f9f6b39a authored by jyx's avatar jyx

代码优化

parent 52c261bd
......@@ -4,7 +4,7 @@
onLaunch: function(options) {
console.log('App onLaunch');
this.getQueryOptions(options)
// this.getQueryOptions(options)
// #ifdef APP-PLUS
//设置2.4秒后主动关闭,最多设置6秒
......@@ -65,22 +65,6 @@
}
// checkUpdate(this);
// #ifdef H5
if (window.location.host === 'www.baosheji.cn') {
var icp = document.createElement('div');
icp.innerText = '京ICP备18032652号';
icp.style.color = 'white';
icp.style.textAlign = 'center';
icp.style.position = 'fixed';
icp.style.bottom = '0';
icp.style.left = '0';
icp.style.right = '0';
icp.style.zIndex = '100';
document.body.appendChild(icp);
}
// #endif
},
onShow: function(options) {
this.globalData.resetLogin = true
......@@ -147,20 +131,16 @@
windowWidth: 0,
bottomSafePadding: 12,
h5Url: 'https://api.mints-tech.cn/index.html',
baseUrl: 'https://book.mints-id.com/readSystem',
// baseUrl: 'http://192.168.110.71:8301/api',
baseUrl: 'https://api.mints-id.com/camera-api/openApi/camera/',
titleButtonWidth: 38,
token: '',
userId: 0,
inviteUId: '',
serviceUrl: '',
loginKey: '',
downUrl: '', //
versionName: 'v 1.0.0',
realNameStatus: false,
auth: false, // 三要素实名认证
userInfo: null,
cardInfo: null,
pkgName: 'com.mints.booksd'
}
};
......@@ -183,4 +163,4 @@
@import './scss/agreement.scss';
@import "@/uni_modules/uview-ui/index.scss";
@import '@/uni.scss';
</style>
</style>
\ No newline at end of file
{
"version" : "1",
"prompt" : "template",
"title" : "服务协议和隐私政策",
"message" : "请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款,包括但不限于:为了更好的向你提供服务,我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>  你可阅读<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>了解详细信息。如果你同意,请点击下面按钮开始接受我们的服务。",
"buttonAccept" : "同意并接受",
"buttonRefuse" : "暂不同意",
"second" : {
"title" : "确认提示",
"message" : "进入应用前,你需先同意<a href=\"https://shimo.im/docs/dPkpKL1EVNIBbXqO\">《用户协议》</a>和<a href=\"https://shimo.im/docs/aBAYVY4mNXfgLm3j\">《隐私政策》</a>,否则将退出应用。",
"buttonAccept" : "同意并继续",
"buttonRefuse" : "退出应用"
},
"styles" : {
"backgroundColor" : "#ffffff",
"borderRadius" : "5px",
"title" : {
"color" : "#008cfb"
},
"buttonAccept" : {
"color" : "#008cfb"
},
"buttonRefuse" : {
"color" : "#c0c0c0"
}
}
}
This diff is collapsed.
<template>
<view class="read" id="read">
<view class="read-content" :class="'read-content'+index" :style="elStyle" v-for="(item,index) in list"
:key="index" @click="toClick">
{{item.content}}
</view>
<!-- <view class="read-content" :style="elStyle" @click="toNext">{{content}}</view>
<view class="read-content-next" :style="elStyle">{{contentNext}}</view> -->
<view class="top-info" v-if="setShow">
<view class="top-info-item">
<text text="上一章" block align="center" v-if="partInfo.previousPartNum != -1"
@tap.native.stop="toPrePart">上一章
</text>
</view>
<view class="top-info-item">
<!-- <u-button type="default" size="mini" plain shape="circle" text="目录" @tap.native.stop="toMenu">
</u-button> -->
<text text="目录" align="center" @tap.native.stop="toMenu">目录</text>
</view>
<view class="top-info-item">
<text text="下一章" align="center" v-if="partInfo.nextPartNum != -1" @tap.native.stop="toNextPart">下一章
</text>
</view>
</view>
<view class="bottom-info" v-if="setShow">
<view class="bottom-info-item">
<text text="设置" prefixIcon="setting" size="17" lineHeight="20" :iconStyle="{fontSize: '20px'}"
align="center" @tap.native.stop="toSet">设置</text>
</view>
<view class="bottom-info-item">
<text text="|" align="center" size="17" color="#dadada">|</text>
</view>
<view class="bottom-info-item">
<text text="返回书城" prefixIcon="home" size="17" lineHeight="20" align="center"
:iconStyle="{fontSize: '20px'}" @tap.native.stop="toHome">返回书城</text>
</view>
</view>
<view class="bottom-info font-style" v-if="setStyleShow">
<view class="item">
<view class="item-title">
字号
</view>
<view class="item-cont">
<view class="item-cont-item" @click="setFontSize(1)">
-
</view>
<view class="item-cont-item" @click="setFontSize(2)">
+
</view>
</view>
</view>
<view class="item">
<view class="item-title">
背景
</view>
<view class="item-cont">
<view class="item-cont-item" :class="curColor==item?'active':''" @click="setBgColor(item)"
v-for="(item,index) in colors" :key="index" :style="'background-color:'+item+';'">
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import datas from "./data.js"
export default {
data() {
return {
content: "22222",
contentPre: "11111",
contentNext: "3333",
list: [],
colors: [
"#F1FAFA",
"#e8ffe8",
"#e8e8ff",
"#8080c0",
],
curColor: "#F1FAFA",
setShow: false,
setStyleShow: false,
isStart: true,
isEnd: false,
width: 0,
height: 0,
start: 0,
end: 0,
length: 0,
heightOffset: 16,
styleObj: {
fontSize: 16,
lineHeight: 1
},
elStyle: "",
partInfo: {
previousPartNum: 1,
nextPartNum: 1
}
};
},
mounted() {
this.$nextTick(() => {
this.init()
})
},
methods: {
setFontSize(flag) {
//-
if (flag == 1) {
if (this.styleObj.fontSize < 10) {
return;
}
this.styleObj.fontSize -= 1;
} else { //+
if (this.styleObj.fontSize > 40) {
return;
}
this.styleObj.fontSize += 1;
}
this.init()
},
setBgColor(color) {
this.curColor = color;
this.setStyle()
},
toSet() {
console.log("设置")
this.setStyleShow = true;
this.setShow = false;
},
toPrePart() {
console.log("上一章节")
},
toNextPart() {
console.log("下一章节")
},
toHome() {
console.log("返回首页")
},
toMenu() {
// this.$refs.parts.open();
console.log("显示目录")
},
toClick(e) {
if (this.setStyleShow || this.setShow) {
this.setStyleShow = false;
this.setShow = false;
return;
}
const width = this.width;
const x = e.detail.x;
if (x < width / 3) {
this.toPre()
} else if (x > (width / 3) * 2) {
this.toNext()
} else {
this.setShow = !this.setShow;
}
},
toPre() {
if (this.isStart) {
uni.showToast({
title: "已经是第一页了",
icon: "none"
})
return;
}
this.start -= this.length;
this.setContent()
},
toNext() {
if (this.isEnd) {
uni.showToast({
title: "已经是最后一页了",
icon: "none"
})
return;
}
this.start += this.length;
this.setContent()
// console.log(this.start, this.list)
},
init() {
console.log(111111111, this.content)
const query = uni.createSelectorQuery().in(this);
const el = query.select("#read").boundingClientRect(data => {
console.log(11111, data)
const width = data.width - 20;
const height = data.height - 20;
this.width = width;
this.height = height;
let lineHeight = ((this.styleObj.fontSize) * this.styleObj.lineHeight) + this.heightOffset;
let lineNum = parseInt(height / lineHeight) - 1;
let fonts = parseInt(width / (this.styleObj.fontSize));
let allFonts = lineNum * fonts;
this.length = allFonts;
console.log("--->>>", allFonts, fonts, lineNum, height, lineHeight)
this.setStyle()
this.setContent()
}).exec();
},
setContent() {
this.list = []
let cont0 = "";
let cont1 = datas.substr(this.start, this.length);
let cont2 = datas.substr(this.start + this.length, this.length);
if (cont1.length < this.length) {
this.isEnd = true;
} else {
this.isEnd = false;
}
if (this.start != 0) {
this.isStart = false;
cont0 = datas.substr(this.start - this.length, this.length)
} else {
this.isStart = true;
}
this.list.push({
index: 0,
content: cont0
})
this.list.push({
index: 1,
content: cont1
})
this.list.push({
index: 2,
content: cont2
})
},
setStyle() {
let fontSize = this.styleObj.fontSize;
let lineHeight = (((this.styleObj.fontSize) * this.styleObj.lineHeight) + this.heightOffset);
this.elStyle = `font-size: ${fontSize}px;line-height: ${lineHeight}px;background-color:${this.curColor};`;
// console.log(1,this.elStyle)
}
},
}
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
}
</style>
<style lang="scss" scoped>
* {
box-sizing: border-box;
}
.read {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
box-sizing: border-box;
&-content {
padding: 20rpx;
width: 100%;
height: 100%;
box-sizing: border-box;
position: absolute;
background-color: #f5ebdc;
}
&-content0 {
z-index: 1;
}
&-content1 {
z-index: 20;
}
&-content2 {
z-index: 10;
}
}
.top-info {
position: fixed;
top: 0rpx;
left: 0rpx;
display: flex;
background-color: #fff;
height: 90rpx;
border-bottom: 1px solid #dadada;
width: 100%;
z-index: 999;
&-item {
padding: 10rpx 0rpx;
flex: 1;
text-align: center;
}
}
.bottom-info {
position: absolute;
box-sizing: border-box;
bottom: 0rpx;
left: 0rpx;
display: flex;
background-color: #fff;
height: 210rpx;
padding: 50rpx 30rpx;
border-top: 1px solid #dadada;
width: 100%;
z-index: 999;
&-item {
padding: 10rpx 0rpx;
flex: 1;
text-align: center;
}
}
.font-style {
height: 400rpx;
flex-direction: column;
}
.item {
display: flex;
padding: 20rpx;
height: 150rpx;
line-height: 110rpx;
&-title {
width: 140rpx;
}
&-cont {
width: calc(100% - 140rpx);
display: flex;
&-item {
flex: 1;
background-color: #d8ebf5;
height: 100rpx;
border-radius: 60rpx;
margin-right: 30rpx;
text-align: center;
font-size: 60rpx;
line-height: 90rpx;
color: #03a9f4;
}
.active {
border: 1px solid #03a9f4;
}
}
}
</style>
// export default {
// created() {
// //#ifdef MP-WEIXIN
// wx.showShareMenu({
// withShareTicket: true,
// menus: ['shareAppMessage', 'shareTimeline']
// });
// //#endif
// },
// }
export default {
data() {
return {
share: {
title: '3D打印你的专属伴侣,点击立刻拥有她/他!',
imageUrl: 'http://mints-sh.oss-cn-shanghai.aliyuncs.com/userImg/share.jpg',
path: '/pages/loading?shareId=' + getApp().globalData.userId,
title: '',
imageUrl: '',
path: '/pages/refund/refund'
// path: '/pages/refund/refund?shareId=' + getApp().globalData.userId,
}
}
},
......
import AlmostLottery from '@/uni_modules/almost-lottery/components/almost-lottery/almost-lottery.vue';
export default {
data() {
return {
loading: true,
// 以下是转盘配置相关数据
lotteryConfig: {
// 抽奖转盘的整体尺寸,单位rpx
lotterySize: 700,
// 抽奖按钮的尺寸,单位rpx
action: {
width: 188,
height: 228,
top: 228 - 188,
padding: 85
},
imgCircled: false,
},
// 转盘外环图,如有需要,请参考替换为自己的设计稿
lotteryBg: require('@/static/turn/zp.png'),
// // 抽奖按钮图
actionBg: require('@/static/turn/point.png'),
// 以下是奖品配置数据
// 奖品数据
prizeList: [
],
// 中奖下标
prizeIndex: -1,
// 是否正在抽奖中,避免重复触发
prizeing: false,
}
},
components: {
AlmostLottery
},
methods:{
remoteGetPrizeIndex(prizeId) {
let list = [...this.prizeList]
// 拿到后端返回的 prizeId 后,开始循环比对得出那个中奖的数据
for (let i = 0; i < list.length; i++) {
let item = list[i]
if (item.prizeId === prizeId) {
this.prizeIndex = i
break
}
}
console.log('本次抽中奖品 =>', this.prizeList[this.prizeIndex].prizeName)
// 如果奖品设有库存
},
// 抽奖转盘绘制完成
handleDrawFinish(res) {
console.log('抽奖转盘绘制完成', res)
}
}
}
......@@ -8,31 +8,38 @@
}
},
"pages": [
// #ifndef APP-PLUS
// {
// "path": "pages/login",
// "style": {
// "navigationStyle": "custom",
// "navigationBarBackgroundColor": "#2196f3",
// "navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
// }
// },
// {
// "path": "pages/doc/doc",
// "style": {
// "navigationStyle": "custom",
// "navigationBarBackgroundColor": "#2196f3",
// "navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
// }
// },
// {
// "path": "pages/custom/custom",
// "style": {
// "navigationStyle": "custom",
// "navigationBarBackgroundColor": "#2196f3",
// "navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
// }
// },
{
"path": "pages/login",
"path": "pages/refund/refund",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTitleText": "客服助手",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
}
},
{
"path": "pages/doc/doc",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black" //用于配置状态栏的字体颜色
}
},
// #endif
{
"path": "pages/brower/brower",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}
],
"globalStyle": {
......
<template>
<view class="chat">
<!-- 顶部标题 -->
<!-- <view class="topTabbar"> -->
<!-- 返回图标 -->
<!-- <u-icon class="icon" name="arrow-left" size="20px" color="#000" @click="goback()"></u-icon> -->
<!-- 标题 -->
<!-- <view class="text">匿名</view> -->
<!-- </view> -->
<scroll-view :style="{height: `${windowHeight-inputHeight}rpx`}" id="scrollview" scroll-y="true"
:scroll-top="scrollTop" class="scroll-view">
<!-- 聊天主体 -->
<view id="msglistview" class="chat-body">
<!-- 聊天记录 -->
<view v-for="(item,index) in msgList" :key="index">
<!-- 自己发的消息 -->
<view class="item self" v-if="item.userContent != ''">
<!-- 文字内容 -->
<view class="content right">
{{item.userContent}}
</view>
<!-- 头像 -->
<image class="avatar" :src="item.image">
</image>
</view>
<!-- 机器人发的消息 -->
<view class="item Ai" v-if="item.botContent != ''">
<!-- 头像 -->
<image class="avatar" :src="item.image">
</image>
<!-- 文字内容 -->
<view class="content left">
{{item.botContent}}
</view>
</view>
</view>
</view>
</scroll-view>
<!-- 底部消息发送栏 -->
<!-- 用来占位,防止聊天消息被发送框遮挡 -->
<view class="chat-bottom" :style="{height: `${inputHeight}rpx`}">
<view class="send-msg" :style="{bottom:`${keyboardHeight - 60}rpx`}">
<view class="uni-textarea">
<textarea v-model="chatMsg" maxlength="300" confirm-type="send" @confirm="handleSend"
placeholder="快来聊天吧~" :show-confirm-bar="false" :adjust-position="false" @linechange="sendHeight"
@focus="focus" @blur="blur" auto-height></textarea>
</view>
<button @click="handleSend" class="send-btn">发送</button>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
//键盘高度
keyboardHeight: 0,
//底部消息发送高度
bottomHeight: 0,
//滚动距离
scrollTop: 0,
userId: '',
//发送的消息
chatMsg: "",
msgList: [{
botContent: "你好啊,很高兴你可以关注我,请问我有什么可以帮助你的吗?",
userContent: "",
image: "/static/common/unname1.jpeg"
},
{
botContent: "",
userContent: "你好呀,非常高兴认识你",
image: "/static/common/unname2.jpg"
},
]
}
},
updated() {
//页面更新时调用聊天消息定位到最底部
this.scrollToBottom();
},
computed: {
windowHeight() {
return this.rpxTopx(uni.getSystemInfoSync().windowHeight)
},
// 键盘弹起来的高度+发送框高度
inputHeight() {
// return this.bottomHeight + this.keyboardHeight
return this.keyboardHeight
}
},
onLoad() {
uni.onKeyboardHeightChange(res => {
//这里正常来讲代码直接写
//this.keyboardHeight=this.rpxTopx(res.height)就行了
//但是之前界面ui设计聊天框的高度有点高,为了不让键盘和聊天输入框之间距离差太大所以我改动了一下。
this.keyboardHeight = this.rpxTopx(res.height)
if (this.keyboardHeight < 0) this.keyboardHeight = 0;
})
},
onUnload() {
// uni.offKeyboardHeightChange()
},
methods: {
goback() {
uni.navigateBack()
},
focus() {
this.scrollToBottom()
},
blur() {
this.scrollToBottom()
},
// px转换成rpx
rpxTopx(px) {
let deviceWidth = uni.getSystemInfoSync().windowWidth
let rpx = (750 / deviceWidth) * Number(px)
return Math.floor(rpx)
},
// 监视聊天发送栏高度
sendHeight() {
setTimeout(() => {
let query = uni.createSelectorQuery();
query.select('.send-msg').boundingClientRect()
query.exec(res => {
this.bottomHeight = this.rpxTopx(res[0].height)
})
}, 10)
},
// 滚动至聊天底部
scrollToBottom(e) {
setTimeout(() => {
let query = uni.createSelectorQuery().in(this);
query.select('#scrollview').boundingClientRect();
query.select('#msglistview').boundingClientRect();
query.exec((res) => {
if (res[1].height > res[0].height) {
this.scrollTop = this.rpxTopx(res[1].height - res[0].height)
}
})
}, 15)
},
// 发送消息
handleSend() {
//如果消息不为空
if (!this.chatMsg || !/^\s+$/.test(this.chatMsg)) {
let obj = {
botContent: "",
userContent: this.chatMsg,
image: "/static/common/unname2.jpg"
}
this.msgList.push(obj);
this.chatMsg = '';
this.scrollToBottom()
} else {
this.$modal.showToast('不能发送空白消息')
}
},
}
}
</script>
<style lang="scss" scoped>
$chatContentbgc: #C2DCFF;
$sendBtnbgc: #4F7DF5;
view,
button,
text,
input,
textarea {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* 聊天消息 */
.chat {
.topTabbar {
width: 100%;
height: 90rpx;
line-height: 90rpx;
display: flex;
margin-top: 80rpx;
justify-content: space-between;
.icon {
margin-left: 20rpx;
}
.text {
margin: auto;
font-size: 16px;
font-weight: 700;
}
.button {
width: 10%;
margin: auto 20rpx auto 0rpx;
}
}
.scroll-view {
::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
color: transparent;
}
// background-color: orange;
background-color: #F6F6F6;
.chat-body {
display: flex;
flex-direction: column;
padding-top: 23rpx;
// background-color:skyblue;
.self {
justify-content: flex-end;
}
.item {
display: flex;
padding: 23rpx 30rpx;
// background-color: greenyellow;
.right {
background-color: $chatContentbgc;
}
.left {
background-color: #FFFFFF;
}
// 聊天消息的三角形
.right::after {
position: absolute;
display: inline-block;
content: '';
width: 0;
height: 0;
left: 100%;
top: 10px;
border: 12rpx solid transparent;
border-left: 12rpx solid $chatContentbgc;
}
.left::after {
position: absolute;
display: inline-block;
content: '';
width: 0;
height: 0;
top: 10px;
right: 100%;
border: 12rpx solid transparent;
border-right: 12rpx solid #FFFFFF;
}
.content {
position: relative;
max-width: 486rpx;
border-radius: 8rpx;
word-wrap: break-word;
padding: 24rpx 24rpx;
margin: 0 24rpx;
border-radius: 5px;
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
line-height: 42rpx;
}
.avatar {
display: flex;
justify-content: center;
width: 78rpx;
height: 78rpx;
background: $sendBtnbgc;
border-radius: 50rpx;
overflow: hidden;
image {
align-self: center;
}
}
}
}
}
/* 底部聊天发送栏 */
.chat-bottom {
width: 100%;
height: 100rpx;
background: #F4F5F7;
transition: all 0.1s ease;
.send-msg {
display: flex;
align-items: flex-end;
padding: 16rpx 30rpx;
width: 100%;
min-height: 177rpx;
position: fixed;
bottom: 0;
background: #fff;
transition: all 0.1s ease;
}
.uni-textarea {
padding-bottom: 70rpx;
textarea {
width: 537rpx;
min-height: 75rpx;
max-height: 500rpx;
background: #f1f1f1;
border-radius: 40rpx;
font-size: 32rpx;
font-family: PingFang SC;
color: #333333;
line-height: 74rpx;
padding: 5rpx 8rpx;
text-indent: 30rpx;
}
}
.send-btn {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 76rpx;
margin-left: 25rpx;
width: 120rpx;
height: 75rpx;
background: #ed5a65;
border-radius: 50rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
line-height: 28rpx;
}
}
}
</style>
\ No newline at end of file
<template>
<view class="body login" :style="'padding-bottom:' + bottomSafePadding + 'px;'">
<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-10" @click="callPhone">{{strLabel3}}</view>
</view>
<uni-popup class="popup" ref="popup1" type="dialog">
<view class="pop-wrap">
<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>
</view>
</swiper-item>
</swiper>
<text class="guide-text" @click="clickGuide">{{guideText}}</text>
</view>
</uni-popup>
<uni-popup class="popup" ref="popup2" type="center">
<view class="pop-wrap" style="justify-content:flex-start">
<view style="margin-left: auto;" @click="closeDialog2">
<icon size="30" type="clear"></icon>
</view>
<view class="refund-wrap flex1 mt-30">
<view class="image-wrap">
<image :src="refundImg" mode="aspectFill" class="image"></image>
</view>
<input v-model="alipayOrder" class="input mt-30" type="number" placeholder="请输入支付宝订单号" />
<text class="guide-text" style="margin-top: 30rpx;" @click="open3">立即退款</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>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
message
} from '@/utils/fun';
const app = getApp();
export default {
name: 'refund',
mixins: [common],
data() {
return {
alipayOrder: '',
showGuidePop: false,
showRefundPop: false,
strInfo: "您好,很高兴为您服务!您可以点击以下问题自助查询,\n如果还不能解决您的问题,可以点击“ 客服电话” 即可联系人工客服人工客服的工作时间是0: 00 - 23: 59",
strLabel1: "1.自动续费如何关闭",
strLabel2: "2.一键退款",
strLabel3: "3.客服电话",
guideImgs: [
"",
"",
""
],
refundImg: '',
guideText: "下一步",
curGuideIndex: 0
};
},
methods: {
handleRefund() {
if (!this.alipayOrder) {
message.notify('请输入支付宝订单号');
return;
}
let that = this
this.post({
url: '/payH5/refundForAliAto',
data: {
orderId: this.alipayOrder
},
success: ({
data
}) => {
that.closeDialog2()
// message.notify(data.msg)
},
fail: () => {
that.closeDialog2()
message.notify("网络出小差了~")
}
});
},
callPhone() {
my.makePhoneCall({
number: '4000969950',
success: function(res) {
console.log('拨打电话成功!');
},
fail: function(res) {
console.log('拨打电话失败!');
}
})
},
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 {
this.guideText = "下一步"
}
},
clickGuide() {
if (this.curGuideIndex >= this.guideImgs.length - 1) {
this.closeDialog1()
} else {
if (++this.curGuideIndex >= this.guideImgs.length - 1) {
this.guideText = "我知道了"
} else {
this.guideText = "下一步"
}
}
},
open1() {
this.$refs.popup1.open()
},
open2() {
this.$refs.popup2.open()
},
open3() {
this.$refs.popup3.open()
},
closeDialog1() {
setTimeout(() => {
this.curGuideIndex = 0
this.guideText = "下一步"
}, 500)
this.$refs.popup1.close()
},
closeDialog2() {
this.$refs.popup2.close()
},
closeDialog3() {
this.$refs.popup3.close()
},
confirm() {
this.closeDialog3()
this.handleRefund()
}
}
};
</script>
<style lang="scss">
.body {
background-color: white;
.label-wrap {
margin-top: 30rpx;
margin-left: 30rpx;
padding-top: 30rpx;
padding-bottom: 50rpx;
padding-left: 30rpx;
padding-right: 30rpx;
width: 65%;
border-radius: 30rpx;
background-color: #F0F5F8;
}
.str {
color: #4F586F;
font-size: 30rpx;
line-height: 50rpx;
}
.str2 {
color: #5AA1F6;
font-size: 30rpx;
line-height: 50rpx;
}
.popup {
pposition: fixed;
z-index: 99;
width: 100%;
background-color: magenta;
height: 100%;
// top: 55%;
// left: 55%;
// transform: translate(-50%, -50%);
// backface-visibility: hidden;
}
.popup2 {
pposition: fixed;
z-index: 999;
}
.pop-wrap {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.refund-wrap {
height: 1000rpx;
border-radius: 20rpx;
background: white;
display: flex;
flex-direction: column;
align-items: center;
overflow: hidden;
.image-wrap {
height: 700rpx;
background-color: #579BEB;
border-radius: 20rpx 20rpx 0 0;
.image {
height: 640rpx;
background-color: white;
margin: 30rpx;
border-radius: 20rpx 20rpx 10rpx 10rpx;
}
}
.input {
border-radius: 10rpx;
border: solid 1px #C9C9C9;
}
}
.swiper-wrap {
margin-top: 200rpx;
height: 800rpx;
.swiper-item {
background-color: white;
border-radius: 20rpx;
display: block;
margin-left: 10%;
margin-right: 10%;
height: 800rpx;
width: 80%;
text-align: center;
}
}
}
.guide-text {
text-align: center;
margin-top: 100rpx;
font-size: 34rpx;
color: #F9F9F9;
width: 320rpx;
height: 85rpx;
line-height: 85rpx;
background: #3881F3;
border-radius: 8rpx;
}
}
</style>
\ No newline at end of file
TGYoypuXSpCliIAj
\ No newline at end of file
| 平台 | 账号 |
| ---- | ---- |
| [微信开放平台](https://open.weixin.qq.com/) | |
| [DCloud开发者](https://dev.dcloud.net.cn/) | 1359763362@qq.com |
┌─uniCloud 云空间目录,阿里云为uniCloud-aliyun,腾讯云为uniCloud-tcb(详见uniCloud)
│─components 符合vue组件规范的uni-app组件目录
│ └─comp-a.vue 可复用的a组件
├─hybrid App端存放本地html文件的目录,详见
├─platforms 存放各平台专用页面的目录,详见
├─pages 业务页面文件存放的目录
│ ├─index
│ │ └─index.vue index页面
│ └─list
│ └─list.vue list页面
├─static 存放应用引用的本地静态资源(如图片、视频等)的目录,注意:静态资源只能存放于此
├─uni_modules 存放[uni_module](/uni_modules)规范的插件。
├─wxcomponents 存放小程序组件的目录,详见
├─main.js Vue初始化入口文件
├─App.vue 应用配置,用来配置App全局样式以及监听 应用生命周期
├─manifest.json 配置应用名称、appid、logo、版本等打包信息,详见
├─pages.json 配置页面路由、导航条、选项卡等页面类信息,详见
└─uni.scss 这里是uni-app内置的常用样式变量
\ No newline at end of file
## 2.0.0(2023-04-15)
- 个人优化 By LuckyRiko
## 1.0.1(2021-11-23)
- 优化 label、label-width 属性
## 1.0.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-combox](https://uniapp.dcloud.io/component/uniui/uni-combox)
## 0.1.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 0.0.6(2021-05-12)
- 新增 组件示例地址
## 0.0.5(2021-04-21)
- 优化 添加依赖 uni-icons, 导入后自动下载依赖
## 0.0.4(2021-02-05)
- 优化 组件引用关系,通过uni_modules引用组件
## 0.0.3(2021-02-04)
- 调整为uni_modules目录规范
<template>
<view class="uni-combox" :class="border ? '' : 'uni-combox__no-border'">
<view v-if="label" class="uni-combox__label" :style="labelStyle">
<text>{{label}}</text>
</view>
<view class="uni-combox__input-box">
<input class="uni-combox__input" type="text" :placeholder="placeholder" :disabled="!inputFlag"
placeholder-class="uni-combox__input-plac" v-model="inputVal" :focus="showSelector && inputFlag"
@click="toggleSelector" />
<uni-icons :type="showSelector? 'top' : 'bottom'" size="14" color="#999" @click="toggleSelector">
</uni-icons>
</view>
<view class="uni-combox__selector" v-if="showSelector">
<view class="uni-popper__arrow"></view>
<scroll-view scroll-y="true" class="uni-combox__selector-scroll">
<view class="uni-combox__selector-empty" v-if="filterCandidatesLength === 0">
<text>{{emptyTips}}</text>
</view>
<block v-else>
<view class="uni-combox__selector-item" @click="onSelectorClick('')">
<text style="color: #ff5353;">清除所选内容</text>
</view>
<view class="uni-combox__selector-item" v-for="(item,index) in filterCandidates" :key="item.id"
@click="onSelectorClick(item.name)">
<text>{{item.name}}</text>
</view>
</block>
</scroll-view>
</view>
</view>
</template>
<script>
/**
* Combox 组合输入框
* @description 组合输入框一般用于既可以输入也可以选择的场景
* @tutorial https://ext.dcloud.net.cn/plugin?id=1261
* @property {String} label 左侧文字
* @property {String} labelWidth 左侧内容宽度
* @property {String} placeholder 输入框占位符
* @property {Array} candidates 候选项列表
* @property {String} emptyTips 筛选结果为空时显示的文字
* @property {String} value 组合框的值
*/
export default {
name: 'uniCombox',
emits: ['input', 'update:modelValue'],
props: {
inputFlag: {
type: Boolean,
default: false
},
border: {
type: Boolean,
default: true
},
label: {
type: String,
default: ''
},
labelWidth: {
type: String,
default: 'auto'
},
placeholder: {
type: String,
default: ''
},
candidates: {
type: Array,
default () {
return []
}
},
emptyTips: {
type: String,
default: '无匹配项'
},
// #ifndef VUE3
value: {
type: [String, Number],
default: ''
},
// #endif
// #ifdef VUE3
modelValue: {
type: [String, Number],
default: ''
},
// #endif
},
data() {
return {
showSelector: false,
inputVal: ''
}
},
computed: {
labelStyle() {
if (this.labelWidth === 'auto') {
return ""
}
return `width: ${this.labelWidth}`
},
filterCandidates() {
console.log('---this.inputVal---', this.inputVal);
if (this.inputVal && this.inputFlag == true) {
return this.candidates.filter((item) => {
return item.name.indexOf(this.inputVal) > -1;
})
} else {
return this.candidates;
}
},
filterCandidatesLength() {
return this.filterCandidates.length
}
},
watch: {
// #ifndef VUE3
value: {
handler(newVal) {
this.inputVal = newVal
},
immediate: true
},
// #endif
// #ifdef VUE3
modelValue: {
handler(newVal) {
this.inputVal = newVal
},
immediate: true
},
// #endif
},
methods: {
toggleSelector() {
this.showSelector = !this.showSelector;
if(this.inputFlag == true && this.showSelector == false){
this.onSelectorClick(this.inputVal);
}
},
onSelectorClick(itemName) {
let item = '';
if (itemName) {
item = this.filterCandidates.find(item => item.name === itemName);
}
if (!item) {
this.inputVal = ''
} else {
this.inputVal = itemName
}
this.$emit('input', item)
// #ifdef VUE3
this.$emit('update:modelValue', item)
// #endif
this.showSelector = false
},
}
}
</script>
<style lang="scss" scoped>
.uni-combox {
font-size: 14px;
border: 1px solid #DCDFE6;
border-radius: 4px;
padding: 6px 10px;
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
// height: 40px;
flex-direction: row;
align-items: center;
// border-bottom: solid 1px #DDDDDD;
}
.uni-combox__label {
font-size: 16px;
line-height: 22px;
padding-right: 10px;
color: #999999;
}
.uni-combox__input-box {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
align-items: center;
}
.uni-combox__input {
flex: 1;
font-size: 14px;
height: 22px;
line-height: 22px;
}
.uni-combox__input-plac {
font-size: 14px;
color: #999;
}
.uni-combox__selector {
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
position: absolute;
top: calc(100% + 12px);
left: 0;
width: 100%;
background-color: #FFFFFF;
border: 1px solid #EBEEF5;
border-radius: 6px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 2;
padding: 4px 0;
}
.uni-combox__selector-scroll {
/* #ifndef APP-NVUE */
max-height: 200px;
box-sizing: border-box;
/* #endif */
}
.uni-combox__selector-empty,
.uni-combox__selector-item {
/* #ifndef APP-NVUE */
display: flex;
cursor: pointer;
/* #endif */
line-height: 36px;
font-size: 14px;
text-align: center;
// border-bottom: solid 1px #DDDDDD;
padding: 0px 10px;
}
.uni-combox__selector-item:hover {
background-color: #f9f9f9;
}
.uni-combox__selector-empty:last-child,
.uni-combox__selector-item:last-child {
/* #ifndef APP-NVUE */
border-bottom: none;
/* #endif */
}
// picker 弹出层通用的指示小三角
.uni-popper__arrow,
.uni-popper__arrow::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px;
}
.uni-popper__arrow {
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
top: -6px;
left: 10%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.uni-popper__arrow::after {
content: " ";
top: 1px;
margin-left: -6px;
border-top-width: 0;
border-bottom-color: #fff;
}
.uni-combox__no-border {
border: none;
}
</style>
\ No newline at end of file
{
"id": "riko-combox",
"displayName": "riko-combox 下拉单选框",
"version": "2.0.0",
"description": "可以选择也可以搜索的下拉单选框 官方魔改版 By LuckyRiko",
"keywords": [
"uni-ui",
"uniui",
"combox",
"组合框",
"select"
],
"repository": "",
"engines": {
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [
"uni-scss",
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "n"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
## Combox 组合框
> **组件名:riko-combox**
组合框组件。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-combox)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
\ No newline at end of file
{
"modes": [
{
"title": "",
"page": "",
"pageQuery": ""
}
]
}
\ No newline at end of file
{
"pages": [
"pages/refund/refund"
],
"subPackages": [],
"window": {
"backgroundColor": "#232325"
},
"usingComponents": {
"plugin-wrapper": "/plugin-wrapper"
}
}
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
@charset "UTF-8";
/**
* 下方引入的为uView UI的集成样式文件,为scss预处理器,其中包含了一些"u-"开头的自定义变量
* 使用的时候,请将下面的一行复制到您的uniapp项目根目录的uni.scss中即可
* uView自定义的css类名和scss变量,均以"u-"开头,不会造成冲突,请放心使用
*/
/* 主题颜色 */
.margin-b5.data-v-7da806a4 {
margin-bottom: 5rpx;
}
.margin-b10.data-v-7da806a4 {
margin-bottom: 10rpx;
}
.margin-b15.data-v-7da806a4 {
margin-bottom: 15rpx;
}
.margin-b20.data-v-7da806a4 {
margin-bottom: 20rpx;
}
.margin-b25.data-v-7da806a4 {
margin-bottom: 25rpx;
}
.margin-b30.data-v-7da806a4 {
margin-bottom: 30rpx;
}
.margin-b40.data-v-7da806a4 {
margin-bottom: 40rpx;
}
.margin-b60.data-v-7da806a4 {
margin-bottom: 60rpx;
}
.margin-b80.data-v-7da806a4 {
margin-bottom: 80rpx;
}
.margin-b100.data-v-7da806a4 {
margin-bottom: 100rpx;
}
.margin-r5.data-v-7da806a4 {
margin-right: 5rpx;
}
.margin-r10.data-v-7da806a4 {
margin-right: 10rpx;
}
.margin-r15.data-v-7da806a4 {
margin-right: 15rpx;
}
.margin-r20.data-v-7da806a4 {
margin-right: 20rpx;
}
.margin-r25.data-v-7da806a4 {
margin-right: 25rpx;
}
.margin-r30.data-v-7da806a4 {
margin-right: 30rpx;
}
.margin-r40.data-v-7da806a4 {
margin-right: 40rpx;
}
.margin-r60.data-v-7da806a4 {
margin-right: 60rpx;
}
.font-18.data-v-7da806a4 {
font-style: normal;
font-size: 18rpx;
font-family: Droid Sans Fallback;
}
.font-20.data-v-7da806a4 {
font-style: normal;
font-size: 20rpx;
font-family: Droid Sans Fallback;
}
.font-22.data-v-7da806a4 {
font-style: normal;
font-size: 22rpx;
font-family: Droid Sans Fallback;
}
.font-24.data-v-7da806a4 {
font-style: normal;
font-size: 24rpx;
font-family: Droid Sans Fallback;
}
.font-26.data-v-7da806a4 {
font-style: normal;
font-size: 26rpx;
font-family: Droid Sans Fallback;
}
.font-28.data-v-7da806a4 {
font-style: normal;
font-size: 28rpx;
font-family: Droid Sans Fallback;
}
.font-30.data-v-7da806a4 {
font-style: normal;
font-size: 30rpx;
font-family: Droid Sans Fallback;
}
.font-32.data-v-7da806a4 {
font-style: normal;
font-size: 32rpx;
font-family: Droid Sans Fallback;
}
.font-34.data-v-7da806a4 {
font-style: normal;
font-size: 34rpx;
font-family: Droid Sans Fallback;
}
.font-36.data-v-7da806a4 {
font-style: normal;
font-size: 36rpx;
font-family: Droid Sans Fallback;
}
.font-38.data-v-7da806a4 {
font-style: normal;
font-size: 38rpx;
font-family: Droid Sans Fallback;
}
.font-40.data-v-7da806a4 {
font-style: normal;
font-size: 40rpx;
font-family: Droid Sans Fallback;
}
.font-46.data-v-7da806a4 {
font-style: normal;
font-size: 46rpx;
font-family: Droid Sans Fallback;
}
.font-50.data-v-7da806a4 {
font-style: normal;
font-size: 50rpx;
font-family: Droid Sans Fallback;
}
.font-60.data-v-7da806a4 {
font-style: normal;
font-size: 60rpx;
font-family: Droid Sans Fallback;
}
.font-80.data-v-7da806a4 {
font-style: normal;
font-size: 80rpx;
font-family: Droid Sans Fallback;
}
.text-left.data-v-7da806a4 {
text-align: left;
}
.text-center.data-v-7da806a4 {
text-align: center;
}
.text-right.data-v-7da806a4 {
text-align: right;
}
.color-white.data-v-7da806a4 {
color: #FFFFFF;
}
.color-red.data-v-7da806a4 {
color: #dc0000;
}
.font-weight-400.data-v-7da806a4 {
font-weight: 400;
}
.font-weight-500.data-v-7da806a4 {
font-weight: bold;
}
.spacing-20.data-v-7da806a4 {
width: 750rpx;
height: 20rpx;
background-color: #f8f8f8;
}
.radius-10.data-v-7da806a4 {
border-radius: 10rpx;
}
.radius-20.data-v-7da806a4 {
border-radius: 20rpx;
}
.radius-30.data-v-7da806a4 {
border-radius: 30rpx;
}
.radius-circle.data-v-7da806a4 {
border-radius: 50%;
}
.radius-height.data-v-7da806a4 {
border-radius: 10000px;
}
.vs-flex-item.data-v-7da806a4 {
flex: 1;
}
.vs-space-between.data-v-7da806a4 {
justify-content: space-between;
}
.vs-space-around.data-v-7da806a4 {
justify-content: space-around;
}
.vs-space-center.data-v-7da806a4 {
justify-content: center;
}
.vs-space-end.data-v-7da806a4 {
justify-content: flex-end;
}
.vs-row.data-v-7da806a4 {
flex-direction: row;
}
.vs-column.data-v-7da806a4 {
flex-direction: column;
}
.vs-align-end.data-v-7da806a4 {
align-items: flex-end;
}
.vs-align-center.data-v-7da806a4 {
align-items: center;
}
.vs-align-start.data-v-7da806a4 {
align-items: flex-start;
}
.vs-item-hover.data-v-7da806a4 {
background-color: rgba(0, 0, 0, 0.05);
}
.vs-btn-hover.data-v-7da806a4 {
opacity: 0.8;
}
.color-base.data-v-7da806a4 {
color: #50A1FF;
}
.bg-color-base.data-v-7da806a4 {
background-color: #50A1FF;
}
/* 行为相关颜色 */
/* 背景颜色 */
/* 边框颜色 */
/* 尺寸变量 */
/* 文字尺寸 */
/* 图片尺寸 */
/* Border Radius */
/* 水平间距 */
/* 垂直间距 */
/* 透明度 */
/* 文章场景相关 */
.uni-popup.data-v-7da806a4 {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 99999999999;
}
.uni-popup__mask.data-v-7da806a4 {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.4);
opacity: 0;
}
.mask-ani.data-v-7da806a4 {
transition-property: opacity;
transition-duration: 0.2s;
}
.uni-top-mask.data-v-7da806a4 {
opacity: 1;
}
.uni-bottom-mask.data-v-7da806a4 {
opacity: 1;
}
.uni-center-mask.data-v-7da806a4 {
opacity: 1;
}
.uni-popup__wrapper.data-v-7da806a4 {
display: block;
position: absolute;
}
.top.data-v-7da806a4 {
top: 0;
left: 0;
right: 0;
-webkit-transform: translateY(-500px);
transform: translateY(-500px);
}
.bottom.data-v-7da806a4 {
bottom: 0;
left: 0;
right: 0;
-webkit-transform: translateY(500px);
transform: translateY(500px);
}
.center.data-v-7da806a4 {
display: flex;
flex-direction: column;
bottom: 0;
left: 0;
right: 0;
top: 0;
justify-content: center;
align-items: center;
-webkit-transform: scale(1.2);
transform: scale(1.2);
opacity: 0;
}
.uni-popup__wrapper-box.data-v-7da806a4 {
display: block;
position: relative;
}
.content-ani.data-v-7da806a4 {
transition-property: opacity, -webkit-transform;
transition-property: transform, opacity;
transition-property: transform, opacity, -webkit-transform;
transition-duration: 0.2s;
}
.uni-top-content.data-v-7da806a4 {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.uni-bottom-content.data-v-7da806a4 {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.uni-center-content.data-v-7da806a4 {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
<block a:if="{{showPopup}}"><view data-event-opts="{{[['touchMove',[['clear',['$event']]]]]}}" class="uni-popup data-v-7da806a4" catchTouchMove="__e"><uni-transition vue-id="374f4eb8-1" mode-class="{{['fade']}}" styles="{{maskClass}}" duration="{{duration}}" show="{{showTrans}}" data-event-opts="{{[['^click',[['onTap']]]]}}" onClick="__e" class="data-v-7da806a4" onVueInit="__l"></uni-transition><uni-transition vue-id="374f4eb8-2" mode-class="{{ani}}" styles="{{transClass}}" duration="{{duration}}" show="{{showTrans}}" data-event-opts="{{[['^click',[['onTap']]]]}}" onClick="__e" class="data-v-7da806a4" onVueInit="__l" vue-slots="{{['default']}}"><view data-event-opts="{{[['tap',[['clear',['$event']]]]]}}" class="uni-popup__wrapper-box data-v-7da806a4" catchTap="__e"><slot></slot></view></uni-transition></view></block>
\ No newline at end of file
{
"component": true,
"styleIsolation": "apply-shared",
"usingComponents": {
"uni-transition": "/components/uni-transition/uni-transition"
}
}
\ No newline at end of file
.uni-transition {
transition-timing-function: ease;
transition-duration: 0.3s;
transition-property: opacity, -webkit-transform;
transition-property: transform, opacity;
transition-property: transform, opacity, -webkit-transform;
}
.fade-in {
opacity: 0;
}
.fade-active {
opacity: 1;
}
.slide-top-in {
/* transition-property: transform, opacity; */
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.slide-top-active {
-webkit-transform: translateY(0);
transform: translateY(0);
/* opacity: 1; */
}
.slide-right-in {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.slide-right-active {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.slide-bottom-in {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.slide-bottom-active {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.slide-left-in {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.slide-left-active {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
.zoom-in-in {
-webkit-transform: scale(0.8);
transform: scale(0.8);
}
.zoom-out-active {
-webkit-transform: scale(1);
transform: scale(1);
}
.zoom-out-in {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
<block a:if="{{isShow}}"><view ref="__r" data-ref="ani" data-event-opts="{{[['tap',[['change',['$event']]]]]}}" class="{{(('uni-transition')+' '+ani.in)}}" style="{{('transform:'+transform+';'+stylesObject)}}" onTap="__e"><slot></slot></view></block>
\ No newline at end of file
{
"usingComponents": {},
"component": true,
"styleIsolation": "apply-shared"
}
\ No newline at end of file
{
"format": 2,
"compileOptions": {
"component2": true
}
}
\ No newline at end of file
This diff is collapsed.
<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
This diff is collapsed.
{
"defaultTitle": "客服助手",
"titleBarColor": "#ffffff",
"usingComponents": {
"uni-popup": "/components/uni-popup/uni-popup",
"uni-popup-dialog": "/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog"
}
}
\ No newline at end of file
<slot></slot>
\ No newline at end of file
Component({onInit(){this.props.onPluginWrap(this)},didUnmount(){this.props.onPluginWrap(this,true)}})
\ No newline at end of file
{"component":true}
\ 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" 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
{
"usingComponents": {},
"component": true,
"styleIsolation": "apply-shared"
}
\ No newline at end of file
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