{{text.title}}
{{text.message}}
{{text.btn.concel}}
{{text.btn.confirm}}
export default {
data(){
return{
isShow:true,
text:{
title:"温馨提示",
message:"代码是写出来给人看的,附带能在机器上运行",
btn:{
concel:"取消",
confirm:"确定"
}
}
}
},
methods:{
hideModal(){
},
addModal(){
}
}
}
.slide-fade-enter-active {
transition: all 3s ease;
}
.slide-fade-leave-active {
transition: all 8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active for below version 2.1.8 */ {
// transform: translateX(10px); opacity: 0;
}
.dialog{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1110;
text-align: center;
backface-visibility: hidden;
perspective: 2000rpx;
background: rgba(0, 0, 0, 0.6);
transition: all 0.3s ease-in-out 0s;
pointer-events: none;
opacity: 1;
transition-duration: 0.3s;
transform: scale(1);
overflow-x: hidden;
overflow-y: auto;
pointer-events: auto;
.cu-dialog {
position: relative;
display: inline-block;
vertical-align: middle;
margin-left: auto;
margin-right: auto;
width: 680rpx;
max-width: 100%;
background-color: #f8f8f8;
border-radius: 10rpx;
overflow: hidden;
top: 35%;
.cu-bar {
display: flex;
position: relative;
align-items: center;
min-height: 100rpx;
justify-content: space-between;
.content {
position: absolute;
text-align: center;
width: calc(100% - 340rpx);
left: 0;
right: 0;
bottom: 0;
top: 0;
margin: auto;
height: 60rpx;
font-size: 32rpx;
line-height: 60rpx;
cursor: none;
pointer-events: none;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.action {
width: 100%;
display: flex;
align-items: center;
flex-direction: row !important;
max-width: 100%;
padding: 20rpx 0;
box-sizing: border-box;
view{
flex: 1;
display: flex;
align-items: center;
justify-content: center;
.cu-btn {
position: relative;
border: 0px;
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 0 30rpx;
font-size: 28rpx;
height: 64rpx;
}
.cu-btn[class*="line"] {
background-color: transparent;
}
.cu-btn:not([class*="bg-"]) { //not 排除 bg- background-color: #f0f0f0;
}
.text-green, .line-green, .lines-green {
color: #3b69ee;
}
.bg-green {
background-color: #3b69ee;
color: #ffffff;
}
}
}
.cu-bar .action:last-child {
margin-right: 30px;
}
.cu-bar .action:first-child {
margin-left: 30rpx;
font-size: 30rpx;
}
}
.bg-white {
background-color: #ffffff;
color: #666666;
}
.justify-end {
justify-content: flex-end;
}
.padding-xl {
padding: 50rpx;
font-size: 26rpx;
}
}
}
// .dialog{// position: fixed;// top: 0;// left: 0;// width: 100%;// height: 100%;// background-color: rgba(0,0,0,0.7);// z-index: 999;// .main{// position: fixed;// top: 45%;// left: calc((100% - 640rpx) / 2);// width: 640rpx;// overflow: hidden;// font-size: 16px;// background-color: #fff;// border-radius: 16px;// .title{
// padding-top: 24rpx;// // font-weight:bold;// line-height: 48rpx;// text-align: center;// }// .message{// max-height: 60vh;// padding:28rpx 48rpx 48rpx;// overflow-y: auto;// font-size: 28rpx;// line-height: 40rpx;// white-space: pre-wrap;// text-align: center;// color: #646566;// }// .footer{// display: flex;// overflow: hidden;// user-select: none;// view{// flex: 1;// width: 100%;// height: 80rpx;// line-height: 80rpx;// color: #323233;// box-sizing: border-box;// font-size: 32rpx;// text-align: center;// border-radius: 4rpx;// border-top: 1px solid #333333;// }// }// }// }
转播
