55 lines
991 B
Vue
55 lines
991 B
Vue
<template>
|
|
<view>
|
|
<u-input v-model="value" type="text" :border="true"
|
|
placeholder="请输入新昵称"
|
|
input-align="center" :clearable="false" class="name-input"/>
|
|
<u-button class="confim" @click="confim" shape="circle" :ripple="true" :plain="false">确认</u-button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data () {
|
|
return {
|
|
value: ''
|
|
}
|
|
},
|
|
methods: {
|
|
// 确认调接口
|
|
confim() {
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.name-input {
|
|
height: 80rpx;
|
|
border-radius: 14rpx;
|
|
border-color: transparent !important;
|
|
margin: 40rpx 20rpx;
|
|
background-color: #2B3062;
|
|
& /deep/ .u-input__input {
|
|
height: 100%;
|
|
}
|
|
& .input-placeholder {
|
|
color: #8688A4;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
|
|
.confim {
|
|
margin: 70rpx 45rpx 29rpx 45rpx;
|
|
height: 90rpx;
|
|
|
|
background: linear-gradient(143deg, #EF6F5F 0%, #FB2636 100%);
|
|
border-radius: 45rpx;
|
|
font-size: 32rpx;
|
|
color: #FFFFFF;
|
|
&::after {
|
|
border: none;
|
|
}
|
|
}
|
|
</style>
|