| | |
|---|
| | | <template>
|
|---|
| | | <view class="personal">
|
|---|
| | | <view class="personal_image">
|
|---|
| | | <view class="personal_image_box">
|
|---|
| | | <image :src="userInfo.avatar ? `${userInfo.prefixUrl}${userInfo.avatar}` : defaultAvatar" mode="widthFix"></image>
|
|---|
| | | </view>
|
|---|
| | | <button class="personal_image_box_btn" open-type="chooseAvatar" @chooseavatar="bindchooseavatar">更换头像</button>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list">
|
|---|
| | | <view class="personal_list_item" @click="show1 = true">
|
|---|
| | | <view class="label">昵称</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text :class="userInfo.wechatName ? 'right_info black' : 'right_info'">{{userInfo.wechatName ? userInfo.wechatName : '点击获取微信昵称'}}</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item">
|
|---|
| | | <view class="label">手机号</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text :class="userInfo.mobile ? 'right_info black' : 'right_info'">{{userInfo.mobile ? userInfo.mobile : '点击获取微信手机号'}}</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="show = true">
|
|---|
| | | <view class="label">真实姓名</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text :class="userInfo.realname ? 'right_info black' : 'right_info'">{{userInfo.realname ? userInfo.realname : '请输入真实姓名'}}</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="sex = true">
|
|---|
| | | <view class="label">性别</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text class="right_info black" v-if="userInfo.sex === 1">男</text>
|
|---|
| | | <text class="right_info black" v-else-if="userInfo.sex === 2">女</text>
|
|---|
| | | <text class="right_info" v-else>请选择</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="isShow = true">
|
|---|
| | | <view class="label">生日</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text :class="userInfo.birthday ? 'right_info black' : 'right_info'">{{userInfo.birthday ? userInfo.birthday : '请选择'}}</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <u-modal :show="show" title="真实姓名" :showCancelButton="true" @confirm="confirm1" @cancel="cancel">
|
|---|
| | | <view class="personal_input">
|
|---|
| | | <input type="text" v-model="from.realname" placeholder="请输入真实姓名" placeholder-class="placeholder">
|
|---|
| | | </view>
|
|---|
| | | </u-modal>
|
|---|
| | | <u-modal :show="show1" title="昵称" :showCancelButton="true" @confirm="confirm2" @cancel="cancel1">
|
|---|
| | | <view class="personal_input">
|
|---|
| | | <input type="nickname" @change="changeName" v-model="from.wechatName" placeholder="请输入昵称" placeholder-class="placeholder">
|
|---|
| | | </view>
|
|---|
| | | </u-modal>
|
|---|
| | | <u-picker
|
|---|
| | | :show="sex"
|
|---|
| | | :columns="columns"
|
|---|
| | | @cancel="sex = false"
|
|---|
| | | :immediateChange="true"
|
|---|
| | | @confirm="confirm"
|
|---|
| | | ></u-picker>
|
|---|
| | | <u-datetime-picker
|
|---|
| | | ref="datetimePicker"
|
|---|
| | | :show="isShow"
|
|---|
| | | v-model="value1"
|
|---|
| | | :minDate="minDate"
|
|---|
| | | :maxDate="maxDate"
|
|---|
| | | mode="date"
|
|---|
| | | @confirm="confirmDate"
|
|---|
| | | @cancel="isShow = false"
|
|---|
| | | ></u-datetime-picker>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal">
|
|---|
| | | <view class="personal_image">
|
|---|
| | | <view class="personal_image_box">
|
|---|
| | | <image
|
|---|
| | | :src="
|
|---|
| | | userInfo.avatar
|
|---|
| | | ? `${userInfo.prefixUrl}${userInfo.avatar}`
|
|---|
| | | : defaultAvatar
|
|---|
| | | "
|
|---|
| | | mode="widthFix"
|
|---|
| | | ></image>
|
|---|
| | | </view>
|
|---|
| | | <button
|
|---|
| | | class="personal_image_box_btn"
|
|---|
| | | open-type="chooseAvatar"
|
|---|
| | | @chooseavatar="bindchooseavatar"
|
|---|
| | | >
|
|---|
| | | 更换头像
|
|---|
| | | </button>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list">
|
|---|
| | | <view class="personal_list_item" @click="show1 = true">
|
|---|
| | | <view class="label">昵称</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text
|
|---|
| | | :class="userInfo.wechatName ? 'right_info black' : 'right_info'"
|
|---|
| | | >{{
|
|---|
| | | userInfo.wechatName ? userInfo.wechatName : "点击获取微信昵称"
|
|---|
| | | }}</text
|
|---|
| | | >
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item">
|
|---|
| | | <view class="label">手机号</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text :class="userInfo.mobile ? 'right_info black' : 'right_info'">{{
|
|---|
| | | userInfo.mobile ? userInfo.mobile : "点击获取微信手机号"
|
|---|
| | | }}</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="show = true">
|
|---|
| | | <view class="label">真实姓名</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text
|
|---|
| | | :class="userInfo.realname ? 'right_info black' : 'right_info'"
|
|---|
| | | >{{
|
|---|
| | | userInfo.realname ? userInfo.realname : "请输入真实姓名"
|
|---|
| | | }}</text
|
|---|
| | | >
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="sex = true">
|
|---|
| | | <view class="label">性别</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text class="right_info black" v-if="userInfo.sex === 1">男</text>
|
|---|
| | | <text class="right_info black" v-else-if="userInfo.sex === 2"
|
|---|
| | | >女</text
|
|---|
| | | >
|
|---|
| | | <text class="right_info" v-else>请选择</text>
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <view class="personal_list_item" @click="isShow = true">
|
|---|
| | | <view class="label">生日</view>
|
|---|
| | | <view class="right">
|
|---|
| | | <text
|
|---|
| | | :class="userInfo.birthday ? 'right_info black' : 'right_info'"
|
|---|
| | | >{{ userInfo.birthday ? userInfo.birthday : "请选择" }}</text
|
|---|
| | | >
|
|---|
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | </view>
|
|---|
| | | <u-modal
|
|---|
| | | :show="show"
|
|---|
| | | title="真实姓名"
|
|---|
| | | :showCancelButton="true"
|
|---|
| | | @confirm="confirm1"
|
|---|
| | | @cancel="cancel"
|
|---|
| | | >
|
|---|
| | | <view class="personal_input">
|
|---|
| | | <input
|
|---|
| | | type="text"
|
|---|
| | | v-model="from.realname"
|
|---|
| | | placeholder="请输入真实姓名"
|
|---|
| | | placeholder-class="placeholder"
|
|---|
| | | />
|
|---|
| | | </view>
|
|---|
| | | </u-modal>
|
|---|
| | | <u-modal
|
|---|
| | | :show="show1"
|
|---|
| | | title="昵称"
|
|---|
| | | :showCancelButton="true"
|
|---|
| | | @confirm="confirm2"
|
|---|
| | | @cancel="cancel1"
|
|---|
| | | >
|
|---|
| | | <view class="personal_input">
|
|---|
| | | <input
|
|---|
| | | type="nickname"
|
|---|
| | | @change="changeName"
|
|---|
| | | v-model="from.wechatName"
|
|---|
| | | placeholder="请输入昵称"
|
|---|
| | | placeholder-class="placeholder"
|
|---|
| | | />
|
|---|
| | | </view>
|
|---|
| | | </u-modal>
|
|---|
| | | <u-picker
|
|---|
| | | :show="sex"
|
|---|
| | | :columns="columns"
|
|---|
| | | @cancel="sex = false"
|
|---|
| | | :immediateChange="true"
|
|---|
| | | @confirm="confirm"
|
|---|
| | | ></u-picker>
|
|---|
| | | <u-datetime-picker
|
|---|
| | | ref="datetimePicker"
|
|---|
| | | :show="isShow"
|
|---|
| | | v-model="value1"
|
|---|
| | | :minDate="minDate"
|
|---|
| | | :maxDate="maxDate"
|
|---|
| | | mode="date"
|
|---|
| | | @confirm="confirmDate"
|
|---|
| | | @cancel="isShow = false"
|
|---|
| | | ></u-datetime-picker>
|
|---|
| | | </view>
|
|---|
| | | </template>
|
|---|
| | |
|
|---|
| | | <script>
|
|---|
| | | import { mapState, mapMutations } from 'vuex'
|
|---|
| | | |
|---|
| | | export default {
|
|---|
| | | data() {
|
|---|
| | | return {
|
|---|
| | | sex: false,
|
|---|
| | | isShow: false,
|
|---|
| | | show: false,
|
|---|
| | | show1: false,
|
|---|
| | | minDate: Number(new Date('1980-01-01')),
|
|---|
| | | maxDate: Number(new Date()),
|
|---|
| | | defaultAvatar: require('@/static/meeting/common/default_user@2x.png'),
|
|---|
| | | columns: [
|
|---|
| | | ['男', '女']
|
|---|
| | | ],
|
|---|
| | | value1: Number(new Date()),
|
|---|
| | | action: this.$baseUrl + 'public/uploadLocal',
|
|---|
| | | from: {
|
|---|
| | | realname: '',
|
|---|
| | | wechatName: ''
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | computed: {
|
|---|
| | | ...mapState(['userInfo'])
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | ...mapMutations(["setUserInfo"]),
|
|---|
| | | changeName(e) {
|
|---|
| | | this.from.wechatName = e.detail.value
|
|---|
| | | },
|
|---|
| | | bindchooseavatar(e) {
|
|---|
| | | var that = this
|
|---|
| | | uni.uploadFile({
|
|---|
| | | url: that.action,
|
|---|
| | | files: 'filePath',
|
|---|
| | | filePath: e.detail.avatarUrl,
|
|---|
| | | name: 'file',
|
|---|
| | | formData: {
|
|---|
| | | 'folder': 'projects'
|
|---|
| | | },
|
|---|
| | | success: (uploadFileRes) => {
|
|---|
| | | console.log(JSON.parse(uploadFileRes.data))
|
|---|
| | | let avatar = JSON.parse(uploadFileRes.data).data.imgaddr
|
|---|
| | | that.$u.api.editUserInfo({ avatar })
|
|---|
| | | .then(res => {
|
|---|
| | | that.getUser()
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | fail: (err) => {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '上传失败',
|
|---|
| | | icon: "error",
|
|---|
| | | duration: 2000
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | },
|
|---|
| | | confirm(e) {
|
|---|
| | | let sex = null
|
|---|
| | | if (e.value[0] === '男') {
|
|---|
| | | sex = 1
|
|---|
| | | } else if (e.value[0] === '女') {
|
|---|
| | | sex = 2
|
|---|
| | | }
|
|---|
| | | this.$u.api.editUserInfo({ sex })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.sex = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | confirmDate(e) {
|
|---|
| | | let birthday = uni.$u.timeFormat(e.value, 'yyyy-mm-dd');
|
|---|
| | | this.$u.api.editUserInfo({ birthday })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.isShow = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 确认真实姓名
|
|---|
| | | confirm1() {
|
|---|
| | | this.$u.api.editUserInfo({ realname: this.from.realname })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.from.realname = ''
|
|---|
| | | this.show = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 昵称
|
|---|
| | | confirm2() {
|
|---|
| | | this.$u.api.editUserInfo({ wechatName: this.from.wechatName })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.from.wechatName = ''
|
|---|
| | | this.show1 = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | cancel1() {
|
|---|
| | | this.show1 = false
|
|---|
| | | },
|
|---|
| | | // 关闭真实姓名
|
|---|
| | | cancel() {
|
|---|
| | | this.show = false
|
|---|
| | | },
|
|---|
| | | getUser() {
|
|---|
| | | this.$u.api.getUserInfo({})
|
|---|
| | | .then(res => {
|
|---|
| | | this.setUserInfo(res.data)
|
|---|
| | | })
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | import { mapState, mapMutations } from 'vuex'
|
|---|
| | |
|
|---|
| | | export default {
|
|---|
| | | data() {
|
|---|
| | | return {
|
|---|
| | | sex: false,
|
|---|
| | | isShow: false,
|
|---|
| | | show: false,
|
|---|
| | | show1: false,
|
|---|
| | | minDate: Number(new Date('1980-01-01')),
|
|---|
| | | maxDate: Number(new Date()),
|
|---|
| | | defaultAvatar: require('@/static/meeting/common/default_user@2x.png'),
|
|---|
| | | columns: [
|
|---|
| | | ['男', '女']
|
|---|
| | | ],
|
|---|
| | | value1: Number(new Date()),
|
|---|
| | | action: this.$baseUrl + 'public/uploadLocal',
|
|---|
| | | from: {
|
|---|
| | | realname: '',
|
|---|
| | | wechatName: ''
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | computed: {
|
|---|
| | | ...mapState(['userInfo'])
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | ...mapMutations(["setUserInfo"]),
|
|---|
| | | changeName(e) {
|
|---|
| | | this.from.wechatName = e.detail.value
|
|---|
| | | },
|
|---|
| | | bindchooseavatar(e) {
|
|---|
| | | var that = this
|
|---|
| | | uni.uploadFile({
|
|---|
| | | url: that.action,
|
|---|
| | | files: 'filePath',
|
|---|
| | | filePath: e.detail.avatarUrl,
|
|---|
| | | name: 'file',
|
|---|
| | | formData: {
|
|---|
| | | 'folder': 'projects'
|
|---|
| | | },
|
|---|
| | | success: (uploadFileRes) => {
|
|---|
| | | console.log(JSON.parse(uploadFileRes.data))
|
|---|
| | | let avatar = JSON.parse(uploadFileRes.data).data.imgaddr
|
|---|
| | | that.$u.api.editUserInfo({ avatar })
|
|---|
| | | .then(res => {
|
|---|
| | | that.getUser()
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | fail: (err) => {
|
|---|
| | | uni.showToast({
|
|---|
| | | title: '上传失败',
|
|---|
| | | icon: "error",
|
|---|
| | | duration: 2000
|
|---|
| | | })
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | confirm(e) {
|
|---|
| | | let sex = null
|
|---|
| | | if (e.value[0] === '男') {
|
|---|
| | | sex = 1
|
|---|
| | | } else if (e.value[0] === '女') {
|
|---|
| | | sex = 2
|
|---|
| | | }
|
|---|
| | | this.$u.api.editUserInfo({ sex })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.sex = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | confirmDate(e) {
|
|---|
| | | let birthday = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
|
|---|
| | | this.$u.api.editUserInfo({ birthday })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.isShow = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 确认真实姓名
|
|---|
| | | confirm1() {
|
|---|
| | | this.$u.api.editUserInfo({ realname: this.from.realname })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.from.realname = ''
|
|---|
| | | this.show = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | // 昵称
|
|---|
| | | confirm2() {
|
|---|
| | | this.$u.api.editUserInfo({ wechatName: this.from.wechatName })
|
|---|
| | | .then(res => {
|
|---|
| | | this.getUser()
|
|---|
| | | this.from.wechatName = ''
|
|---|
| | | this.show1 = false
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | cancel1() {
|
|---|
| | | this.show1 = false
|
|---|
| | | },
|
|---|
| | | // 关闭真实姓名
|
|---|
| | | cancel() {
|
|---|
| | | this.show = false
|
|---|
| | | },
|
|---|
| | | getUser() {
|
|---|
| | | this.$u.api.getUserInfo({})
|
|---|
| | | .then(res => {
|
|---|
| | | this.setUserInfo(res.data)
|
|---|
| | | })
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | </script>
|
|---|
| | |
|
|---|
| | | <style>
|
|---|
| | | page {
|
|---|
| | | background-color: #fff !important;
|
|---|
| | | }
|
|---|
| | | page {
|
|---|
| | | background-color: #fff !important;
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | |
|
|---|
| | | <style lang="scss" scoped>
|
|---|
| | | .personal {
|
|---|
| | | width: 100%;
|
|---|
| | | background-color: #ffffff;
|
|---|
| | | .personal_input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 98rpx;
|
|---|
| | | background: #F8F9FB;
|
|---|
| | | border-radius: 8rpx;
|
|---|
| | | .placeholder {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #000000;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_image {
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: center;
|
|---|
| | | flex-direction: column;
|
|---|
| | | padding-top: 64rpx;
|
|---|
| | | margin-bottom: 60rpx;
|
|---|
| | | .personal_image_box {
|
|---|
| | | width: 160rpx;
|
|---|
| | | height: 160rpx;
|
|---|
| | | border-radius: 50%;
|
|---|
| | | overflow: hidden;
|
|---|
| | | image {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_image_box_btn {
|
|---|
| | | width: 136rpx;
|
|---|
| | | height: 48rpx;
|
|---|
| | | line-height: 48rpx;
|
|---|
| | | padding: 0 !important;
|
|---|
| | | border-radius: 32rpx;
|
|---|
| | | border: 1rpx solid #005BFF;
|
|---|
| | | font-size: 24rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #005BFF;
|
|---|
| | | margin-top: 24rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_list {
|
|---|
| | | display: flex;
|
|---|
| | | flex-direction: column;
|
|---|
| | | padding: 0 34rpx;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .personal_list_item {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 96rpx;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: space-between;
|
|---|
| | | border-bottom: 2rpx solid #E5E5E5;
|
|---|
| | | &:last-child {
|
|---|
| | | border: none !important;
|
|---|
| | | }
|
|---|
| | | .label {
|
|---|
| | | flex-shrink: 0;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 500;
|
|---|
| | | color: #333333;
|
|---|
| | | margin-right: 30rpx;
|
|---|
| | | }
|
|---|
| | | .right {
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | .black {
|
|---|
| | | color: #000000 !important;
|
|---|
| | | }
|
|---|
| | | .right_info {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFang SC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | text {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFang SC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #666666;
|
|---|
| | | margin-right: 12rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .popup2 /deep/ {
|
|---|
| | | width: 518rpx;
|
|---|
| | | background: #FFFFFF;
|
|---|
| | | border-radius: 24rpx;
|
|---|
| | | .popup_text {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | margin: 46rpx 0;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .popup2_ipt {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 98rpx;
|
|---|
| | | overflow: hidden;
|
|---|
| | | border-radius: 8rpx;
|
|---|
| | | padding: 0 48rpx;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | margin-bottom: 48rpx;
|
|---|
| | | .popup2_ipt_box {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | background: #F8F9FB;
|
|---|
| | | .popup2_ipt_p {
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #000000;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .popup_box {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 85rpx;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | border-top: 2rpx solid #C8C8C8;
|
|---|
| | | .blue {
|
|---|
| | | color: #005BFF !important;
|
|---|
| | | }
|
|---|
| | | .popup_box_item {
|
|---|
| | | flex: 1;
|
|---|
| | | height: 100%;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: center;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | &:first-child {
|
|---|
| | | border-right: 2rpx solid #C8C8C8;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .sex {
|
|---|
| | | padding: 44rpx 32rpx;
|
|---|
| | | background-color: #FFFFFF;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .title {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | position: relative;
|
|---|
| | | text {
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .title_icon {
|
|---|
| | | position: absolute;
|
|---|
| | | right: 0;
|
|---|
| | | top: 0;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .content {
|
|---|
| | | width: 100%;
|
|---|
| | | margin-top: 80rpx;
|
|---|
| | | .picker-view {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 200rpx;
|
|---|
| | | .item {
|
|---|
| | | height: 40px;
|
|---|
| | | line-height: 40px;
|
|---|
| | | text-align: center;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .submit {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 72rpx;
|
|---|
| | | line-height: 72rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005BFF;
|
|---|
| | | border-radius: 36rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 500;
|
|---|
| | | color: #FFFFFF;
|
|---|
| | | margin-top: 50rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .date {
|
|---|
| | | padding: 44rpx 32rpx;
|
|---|
| | | background-color: #FFFFFF;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .title {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | position: relative;
|
|---|
| | | text {
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .title_icon {
|
|---|
| | | position: absolute;
|
|---|
| | | right: 0;
|
|---|
| | | top: 0;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .content {
|
|---|
| | | width: 100%;
|
|---|
| | | margin-top: 80rpx;
|
|---|
| | | .picker-view {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 600rpx;
|
|---|
| | | .item {
|
|---|
| | | height: 40px;
|
|---|
| | | line-height: 40px;
|
|---|
| | | text-align: center;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .submit {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 72rpx;
|
|---|
| | | line-height: 72rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005BFF;
|
|---|
| | | border-radius: 36rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 500;
|
|---|
| | | color: #FFFFFF;
|
|---|
| | | margin-top: 50rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_footer {
|
|---|
| | | position: fixed;
|
|---|
| | | width: 100%;
|
|---|
| | | left: 0;
|
|---|
| | | bottom: 0;
|
|---|
| | | background-color: #FFFFFF;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | padding: 20rpx 30rpx calc(20rpx + env(safe-area-inset-bottom)) 30rpx;
|
|---|
| | | .personal_footer_btn {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 88rpx;
|
|---|
| | | line-height: 88rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005BFF;
|
|---|
| | | border-radius: 44rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFangSC-Medium, PingFang SC;
|
|---|
| | | font-weight: 500;
|
|---|
| | | color: #FFFFFF;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal {
|
|---|
| | | width: 100%;
|
|---|
| | | background-color: #ffffff;
|
|---|
| | | .personal_input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 98rpx;
|
|---|
| | | background: #f8f9fb;
|
|---|
| | | border-radius: 8rpx;
|
|---|
| | | .placeholder {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #000000;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_image {
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: center;
|
|---|
| | | flex-direction: column;
|
|---|
| | | padding-top: 64rpx;
|
|---|
| | | margin-bottom: 60rpx;
|
|---|
| | | .personal_image_box {
|
|---|
| | | width: 160rpx;
|
|---|
| | | height: 160rpx;
|
|---|
| | | border-radius: 50%;
|
|---|
| | | overflow: hidden;
|
|---|
| | | image {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_image_box_btn {
|
|---|
| | | width: 136rpx;
|
|---|
| | | height: 48rpx;
|
|---|
| | | line-height: 48rpx;
|
|---|
| | | padding: 0 !important;
|
|---|
| | | border-radius: 32rpx;
|
|---|
| | | border: 1rpx solid #005bff;
|
|---|
| | | font-size: 24rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #005bff;
|
|---|
| | | margin-top: 24rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_list {
|
|---|
| | | display: flex;
|
|---|
| | | flex-direction: column;
|
|---|
| | | padding: 0 34rpx;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .personal_list_item {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 96rpx;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: space-between;
|
|---|
| | | border-bottom: 2rpx solid #e5e5e5;
|
|---|
| | | &:last-child {
|
|---|
| | | border: none !important;
|
|---|
| | | }
|
|---|
| | | .label {
|
|---|
| | | flex-shrink: 0;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | margin-right: 30rpx;
|
|---|
| | | }
|
|---|
| | | .right {
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | .black {
|
|---|
| | | color: #000000 !important;
|
|---|
| | | }
|
|---|
| | | .right_info {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFang SC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | text {
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFang SC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #666666;
|
|---|
| | | margin-right: 12rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .popup2 /deep/ {
|
|---|
| | | width: 518rpx;
|
|---|
| | | background: #ffffff;
|
|---|
| | | border-radius: 24rpx;
|
|---|
| | | .popup_text {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | margin: 46rpx 0;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .popup2_ipt {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 98rpx;
|
|---|
| | | overflow: hidden;
|
|---|
| | | border-radius: 8rpx;
|
|---|
| | | padding: 0 48rpx;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | margin-bottom: 48rpx;
|
|---|
| | | .popup2_ipt_box {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | background: #f8f9fb;
|
|---|
| | | .popup2_ipt_p {
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #999999;
|
|---|
| | | }
|
|---|
| | | input {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | font-size: 28rpx;
|
|---|
| | | font-family: PingFangSC-Regular, PingFang SC;
|
|---|
| | | font-weight: 400;
|
|---|
| | | color: #000000;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .popup_box {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 85rpx;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | border-top: 2rpx solid #c8c8c8;
|
|---|
| | | .blue {
|
|---|
| | | color: #005bff !important;
|
|---|
| | | }
|
|---|
| | | .popup_box_item {
|
|---|
| | | flex: 1;
|
|---|
| | | height: 100%;
|
|---|
| | | display: flex;
|
|---|
| | | align-items: center;
|
|---|
| | | justify-content: center;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | &:first-child {
|
|---|
| | | border-right: 2rpx solid #c8c8c8;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .sex {
|
|---|
| | | padding: 44rpx 32rpx;
|
|---|
| | | background-color: #ffffff;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .title {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | position: relative;
|
|---|
| | | text {
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .title_icon {
|
|---|
| | | position: absolute;
|
|---|
| | | right: 0;
|
|---|
| | | top: 0;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .content {
|
|---|
| | | width: 100%;
|
|---|
| | | margin-top: 80rpx;
|
|---|
| | | .picker-view {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 200rpx;
|
|---|
| | | .item {
|
|---|
| | | height: 40px;
|
|---|
| | | line-height: 40px;
|
|---|
| | | text-align: center;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .submit {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 72rpx;
|
|---|
| | | line-height: 72rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005bff;
|
|---|
| | | border-radius: 36rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #ffffff;
|
|---|
| | | margin-top: 50rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .date {
|
|---|
| | | padding: 44rpx 32rpx;
|
|---|
| | | background-color: #ffffff;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | .title {
|
|---|
| | | width: 100%;
|
|---|
| | | text-align: center;
|
|---|
| | | position: relative;
|
|---|
| | | text {
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Semibold, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #333333;
|
|---|
| | | }
|
|---|
| | | .title_icon {
|
|---|
| | | position: absolute;
|
|---|
| | | right: 0;
|
|---|
| | | top: 0;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .content {
|
|---|
| | | width: 100%;
|
|---|
| | | margin-top: 80rpx;
|
|---|
| | | .picker-view {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 600rpx;
|
|---|
| | | .item {
|
|---|
| | | height: 40px;
|
|---|
| | | line-height: 40px;
|
|---|
| | | text-align: center;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .submit {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 72rpx;
|
|---|
| | | line-height: 72rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005bff;
|
|---|
| | | border-radius: 36rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFang SC-Medium, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #ffffff;
|
|---|
| | | margin-top: 50rpx;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | .personal_footer {
|
|---|
| | | position: fixed;
|
|---|
| | | width: 100%;
|
|---|
| | | left: 0;
|
|---|
| | | bottom: 0;
|
|---|
| | | background-color: #ffffff;
|
|---|
| | | box-sizing: border-box;
|
|---|
| | | padding: 20rpx 30rpx calc(20rpx + env(safe-area-inset-bottom)) 30rpx;
|
|---|
| | | .personal_footer_btn {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 88rpx;
|
|---|
| | | line-height: 88rpx;
|
|---|
| | | text-align: center;
|
|---|
| | | background: #005bff;
|
|---|
| | | border-radius: 44rpx;
|
|---|
| | | font-size: 32rpx;
|
|---|
| | | font-family: PingFangSC-Medium, PingFang SC;
|
|---|
| | | font-weight: 600;
|
|---|
| | | color: #ffffff;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | </style> |
|---|
