chenkainan
11 months ago
6 changed files with 937 additions and 4 deletions
@ -0,0 +1,196 @@ |
|||
function getLocalFilePath(path) { |
|||
if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('file://') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('/storage/emulated/0/') === 0) { |
|||
return path |
|||
} |
|||
if (path.indexOf('/') === 0) { |
|||
var localFilePath = plus.io.convertAbsoluteFileSystem(path) |
|||
if (localFilePath !== path) { |
|||
return localFilePath |
|||
} else { |
|||
path = path.substr(1) |
|||
} |
|||
} |
|||
return '_www/' + path |
|||
} |
|||
|
|||
function dataUrlToBase64(str) { |
|||
var array = str.split(',') |
|||
return array[array.length - 1] |
|||
} |
|||
|
|||
var index = 0 |
|||
function getNewFileId() { |
|||
return Date.now() + String(index++) |
|||
} |
|||
|
|||
function biggerThan(v1, v2) { |
|||
var v1Array = v1.split('.') |
|||
var v2Array = v2.split('.') |
|||
var update = false |
|||
for (var index = 0; index < v2Array.length; index++) { |
|||
var diff = v1Array[index] - v2Array[index] |
|||
if (diff !== 0) { |
|||
update = diff > 0 |
|||
break |
|||
} |
|||
} |
|||
return update |
|||
} |
|||
|
|||
export function pathToBase64(path) { |
|||
return new Promise(function(resolve, reject) { |
|||
if (typeof window === 'object' && 'document' in window) { |
|||
if (typeof FileReader === 'function') { |
|||
var xhr = new XMLHttpRequest() |
|||
xhr.open('GET', path, true) |
|||
xhr.responseType = 'blob' |
|||
xhr.onload = function() { |
|||
if (this.status === 200) { |
|||
let fileReader = new FileReader() |
|||
fileReader.onload = function(e) { |
|||
resolve(e.target.result) |
|||
} |
|||
fileReader.onerror = reject |
|||
fileReader.readAsDataURL(this.response) |
|||
} |
|||
} |
|||
xhr.onerror = reject |
|||
xhr.send() |
|||
return |
|||
} |
|||
var canvas = document.createElement('canvas') |
|||
var c2x = canvas.getContext('2d') |
|||
var img = new Image |
|||
img.onload = function() { |
|||
canvas.width = img.width |
|||
canvas.height = img.height |
|||
c2x.drawImage(img, 0, 0) |
|||
resolve(canvas.toDataURL()) |
|||
canvas.height = canvas.width = 0 |
|||
} |
|||
img.onerror = reject |
|||
img.src = path |
|||
return |
|||
} |
|||
if (typeof plus === 'object') { |
|||
plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) { |
|||
entry.file(function(file) { |
|||
var fileReader = new plus.io.FileReader() |
|||
fileReader.onload = function(data) { |
|||
resolve(data.target.result) |
|||
} |
|||
fileReader.onerror = function(error) { |
|||
reject(error) |
|||
} |
|||
fileReader.readAsDataURL(file) |
|||
}, function(error) { |
|||
reject(error) |
|||
}) |
|||
}, function(error) { |
|||
reject(error) |
|||
}) |
|||
return |
|||
} |
|||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { |
|||
wx.getFileSystemManager().readFile({ |
|||
filePath: path, |
|||
encoding: 'base64', |
|||
success: function(res) { |
|||
resolve('data:image/png;base64,' + res.data) |
|||
}, |
|||
fail: function(error) { |
|||
reject(error) |
|||
} |
|||
}) |
|||
return |
|||
} |
|||
reject(new Error('not support')) |
|||
}) |
|||
} |
|||
|
|||
export function base64ToPath(base64) { |
|||
return new Promise(function(resolve, reject) { |
|||
if (typeof window === 'object' && 'document' in window) { |
|||
base64 = base64.split(',') |
|||
var type = base64[0].match(/:(.*?);/)[1] |
|||
var str = atob(base64[1]) |
|||
var n = str.length |
|||
var array = new Uint8Array(n) |
|||
while (n--) { |
|||
array[n] = str.charCodeAt(n) |
|||
} |
|||
return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type }))) |
|||
} |
|||
var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/) |
|||
if (extName) { |
|||
extName = extName[1] |
|||
} else { |
|||
reject(new Error('base64 error')) |
|||
} |
|||
var fileName = getNewFileId() + '.' + extName |
|||
if (typeof plus === 'object') { |
|||
var basePath = '_doc' |
|||
var dirPath = 'uniapp_temp' |
|||
var filePath = basePath + '/' + dirPath + '/' + fileName |
|||
if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) { |
|||
plus.io.resolveLocalFileSystemURL(basePath, function(entry) { |
|||
entry.getDirectory(dirPath, { |
|||
create: true, |
|||
exclusive: false, |
|||
}, function(entry) { |
|||
entry.getFile(fileName, { |
|||
create: true, |
|||
exclusive: false, |
|||
}, function(entry) { |
|||
entry.createWriter(function(writer) { |
|||
writer.onwrite = function() { |
|||
resolve(filePath) |
|||
} |
|||
writer.onerror = reject |
|||
writer.seek(0) |
|||
writer.writeAsBinary(dataUrlToBase64(base64)) |
|||
}, reject) |
|||
}, reject) |
|||
}, reject) |
|||
}, reject) |
|||
return |
|||
} |
|||
var bitmap = new plus.nativeObj.Bitmap(fileName) |
|||
bitmap.loadBase64Data(base64, function() { |
|||
bitmap.save(filePath, {}, function() { |
|||
bitmap.clear() |
|||
resolve(filePath) |
|||
}, function(error) { |
|||
bitmap.clear() |
|||
reject(error) |
|||
}) |
|||
}, function(error) { |
|||
bitmap.clear() |
|||
reject(error) |
|||
}) |
|||
return |
|||
} |
|||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { |
|||
var filePath = wx.env.USER_DATA_PATH + '/' + fileName |
|||
wx.getFileSystemManager().writeFile({ |
|||
filePath: filePath, |
|||
data: dataUrlToBase64(base64), |
|||
encoding: 'base64', |
|||
success: function() { |
|||
resolve(filePath) |
|||
}, |
|||
fail: function(error) { |
|||
reject(error) |
|||
} |
|||
}) |
|||
return |
|||
} |
|||
reject(new Error('not support')) |
|||
}) |
|||
} |
|||
@ -0,0 +1,11 @@ |
|||
{ |
|||
"id": "mmmm-image-tools", |
|||
"name": "image-tools", |
|||
"version": "1.4.0", |
|||
"description": "图像转换工具，可用于图像和base64的转换", |
|||
"keywords": [ |
|||
"base64", |
|||
"保存", |
|||
"图像" |
|||
] |
|||
} |
|||
@ -0,0 +1,219 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
|
|||
<view class="user-other-info"> |
|||
|
|||
<view class="nickname-box"> |
|||
<input v-model="inputValue" type="text" placeholder="请输入内容" /> |
|||
</view> |
|||
|
|||
|
|||
<view class="btn-tao" @click="submit">保存</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex' |
|||
import {pathToBase64} from "@/static/js/mmmm-image-tools/index.js" |
|||
export default { |
|||
data() { |
|||
return { |
|||
valueType: '', |
|||
inputValue: '', |
|||
|
|||
|
|||
lingo_ids: null, lingo_idsStr:'', |
|||
scenic_ids: null, scenic_idsStr:'', |
|||
|
|||
keyNames: [ |
|||
{key: 'nickname', value:'姓名'},{key: 'mobile', value:'手机号'}, |
|||
{key: 'certificate_number', value: '导游证号码'}, |
|||
{key: 'duration',value: '工作年限'}, |
|||
{key: 'bio',value: '个性签名'}, |
|||
{key: 'scenic_ids',value: '擅长景区'}, |
|||
{key: 'lingo_ids',value: '语言能力'}, |
|||
] |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState(['lingoIds','scenicIds']) |
|||
}, |
|||
|
|||
|
|||
onLoad(options) { |
|||
this.initData(options) |
|||
}, |
|||
|
|||
|
|||
methods: { |
|||
initData (options) { |
|||
uni.setNavigationBarTitle({title: ''}); |
|||
this.valueType = '' |
|||
this.inputValue = '' |
|||
if (options.valueType) { |
|||
this.valueType = options.valueType |
|||
let titleData = this.keyNames.find(v=>v.key == this.valueType) |
|||
if (titleData) { |
|||
uni.setNavigationBarTitle({title: titleData.value}); |
|||
} |
|||
|
|||
} else { |
|||
this.goBack() |
|||
return |
|||
} |
|||
if (options.inputValue && options.inputValue!='null' && options.inputValue!='undefined') { |
|||
this.inputValue = options.inputValue |
|||
} |
|||
|
|||
console.log(this.lingoIds, this.scenicIds) |
|||
}, |
|||
|
|||
uploadImg() { |
|||
uni.chooseImage({ |
|||
success: (chooseImageRes) => { |
|||
const tempFilePaths = chooseImageRes.tempFilePaths; |
|||
|
|||
// // #ifdef MP-WEIXIN |
|||
// uni.getFileSystemManager().readFile({ |
|||
// filePath: tempFilePaths[0], |
|||
// encoding: 'base64', |
|||
// success: res => { |
|||
// this.Post({ |
|||
// method: 'POST', |
|||
// base64: 'data:image/png;base64,' + res.data |
|||
// }, '/api/common/base64').then(res => { |
|||
// if (res.data) { |
|||
// this.Post({ |
|||
// avatar: res.data |
|||
// }, '/api/user/profile').then(res => { |
|||
// uni.showModal({ |
|||
// title: '提示', |
|||
// content: res.msg, |
|||
// showCancel: false, |
|||
// success: res => { |
|||
// if (res.confirm) { |
|||
// this.getList() |
|||
// } |
|||
// } |
|||
// }) |
|||
// }) |
|||
// } |
|||
// }) |
|||
// } |
|||
// }) |
|||
// // #endif |
|||
|
|||
pathToBase64(tempFilePaths[0]).then(base64 => { |
|||
this.Post({ |
|||
method: 'POST', |
|||
base64: base64 |
|||
}, '/api/common/base64').then(res => { |
|||
if (res.data) { |
|||
this.Post({ |
|||
avatar: res.data |
|||
}, '/api/user/profile').then(res => { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.getList() |
|||
} |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
|
|||
|
|||
submit() { |
|||
uni.$emit("updateInfo", { |
|||
msgType: 'registerInfo', |
|||
data: { |
|||
valueType: this.valueType, |
|||
inputValue: this.inputValue |
|||
} |
|||
}) |
|||
this.goBack() |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
view { |
|||
box-sizing: content-box; |
|||
} |
|||
.bg{ |
|||
min-height: 100vh; |
|||
overflow-x: hidden; |
|||
background: white; |
|||
padding-bottom: 50rpx; |
|||
} |
|||
|
|||
.empty-value{ |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.nickname-box { |
|||
display: flex; |
|||
align-items: center; |
|||
background: white; |
|||
margin-bottom: 100rpx; |
|||
font-size: 30rpx; |
|||
height: 70rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
span { |
|||
flex-shrink: 0; |
|||
} |
|||
input { |
|||
flex: 1; |
|||
font-size: 30rpx; |
|||
display: block; |
|||
} |
|||
} |
|||
|
|||
|
|||
.user-other-info { |
|||
padding: 30rpx; |
|||
} |
|||
|
|||
.userinfo-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 28rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 40rpx 30rpx 40rpx 0; |
|||
height: 48rpx; |
|||
color: #333; |
|||
position: relative; |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
.btn-tao { |
|||
width: 333rpx; |
|||
height: 80rpx; |
|||
background: #96684F; |
|||
border-radius: 40rpx; |
|||
text-align: center; |
|||
font-size: 30rpx; |
|||
line-height: 80rpx; |
|||
color: #FFFFFF; |
|||
margin: 68rpx auto 0; |
|||
} |
|||
</style> |
|||
@ -1,8 +1,499 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="header-tip">请填写您的信息，稍后平台工作人员会电话联系您~</view> |
|||
|
|||
<view class="user-other-info"> |
|||
<view class="info-title">·基础信息</view> |
|||
<div class="info-avatar-top"> |
|||
<span>头像</span> |
|||
<view @click="uploadAvator()"> |
|||
<image v-if="info.avatar" :src="info.avatar" mode="aspectFill" |
|||
style="width: 80rpx;height: 80rpx;border-radius: 50%;"></image> |
|||
<div v-else style="width: 80rpx;height: 80rpx;border-radius: 50%;background: #0B898E;"></div> |
|||
</view> |
|||
</div> |
|||
<view class="userinfo-item" @click="changeValue('nickname')"> |
|||
<span>姓名</span> |
|||
<view class="text-overflow" v-if="info.nickname">{{info.nickname}}</view> |
|||
<view v-else class="empty-value" >请填写</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="selectSex"> |
|||
<span>性别</span> |
|||
<view class="text-overflow" v-if="info.genderStr">{{info.genderStr}}</view> |
|||
<view v-else class="empty-value" >请选择</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('mobile')"> |
|||
<span>手机号</span> |
|||
<view v-if="info.mobile">{{info.mobile}}</view> |
|||
<view v-else class="empty-value" >请填写</view> |
|||
</view> |
|||
|
|||
<view class="info-title" style="margin-top: 46rpx;">·工作相关</view> |
|||
<view class="userinfo-item" @click="selectRank"> |
|||
<span>导游等级</span> |
|||
<view v-if="info.group_idStr">{{info.group_idStr}}</view> |
|||
<view v-else class="empty-value">请选择</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('certificate_number')"> |
|||
<span>导游证号</span> |
|||
<view class="text-overflow" v-if="info.certificate_number">{{info.certificate_number}}</view> |
|||
<view v-else class="empty-value">请填写</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('duration')"> |
|||
<span>工作年限</span> |
|||
<view class="text-overflow" v-if="info.duration">{{info.duration}}</view> |
|||
<view v-else class="empty-value">请填写</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('lingo_ids')"> |
|||
<span>语言能力</span> |
|||
<view class="text-overflow" v-if="info.lingo_idsStr">{{info.lingo_idsStr}}</view> |
|||
<view v-else class="empty-value">请选择</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('scenic_ids')"> |
|||
<span>擅长景区</span> |
|||
<view class="text-overflow" v-if="info.scenic_idsStr">{{info.scenic_idsStr}}</view> |
|||
<view v-else class="empty-value">请选择</view> |
|||
</view> |
|||
<view class="userinfo-item" @click="changeValue('bio')"> |
|||
<span>个性签名</span> |
|||
<view class="text-overflowRows" v-if="info.bio">{{info.bio}}</view> |
|||
<view v-else class="empty-value">请填写</view> |
|||
</view> |
|||
<view class="userinfo-item"> |
|||
<span>核心亮点</span> |
|||
<view class="text-overflow" v-if="info.bio">{{info.bio}}</view> |
|||
<view v-else class="empty-value">请填写</view> |
|||
</view> |
|||
|
|||
<view class="info-title" style="margin-top: 46rpx;">·讲解视频</view> |
|||
<view class="userinfo-item" @click="selectRank"> |
|||
<span>讲解视频</span> |
|||
<view class="text-overflow" v-if="info.rankStr">{{info.rankStr}}</view> |
|||
<view v-else class="empty-value">请选择</view> |
|||
</view> |
|||
|
|||
<view class="btn-tao" @click="submit">我已填好</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import {pathToBase64} from "@/static/js/mmmm-image-tools/index.js" |
|||
export default { |
|||
data() { |
|||
|
|||
return { |
|||
info: { |
|||
nickname: '',mobile:'',avatar: '', |
|||
gender: null, genderStr: '', |
|||
group_id: null,group_idStr: '', |
|||
certificate_number: '',duration:'', |
|||
lingo_ids: null, lingo_idsStr:'', |
|||
scenic_ids: null, scenic_idsStr:'', |
|||
bio:'' |
|||
}, |
|||
|
|||
groupIds: [], // 导游等级 |
|||
lingoIds: [],// 语言列表 |
|||
scenicIds: [], // 景区列表 |
|||
} |
|||
}, |
|||
mounted() { |
|||
uni.$on("updateInfo",this.updateInfo) |
|||
}, |
|||
beforeUnmount () { |
|||
console.log('触发off') |
|||
uni.$off("updateInfo",this.updateInfo) |
|||
}, |
|||
beforeDestroy () { |
|||
console.log('触发off') |
|||
uni.$off("updateInfo",this.updateInfo) |
|||
}, |
|||
|
|||
onLoad () { |
|||
this.Post({}, '/api/Merchants/get_graphic').then(res => {}) |
|||
|
|||
this.initSelect() |
|||
}, |
|||
methods: { |
|||
initSelect () { |
|||
// 获取导游等级 |
|||
this.Post({}, '/api/guide/getGuideGroupList').then(res => { |
|||
this.groupIds = res.data |
|||
}) |
|||
// 获取导游语言列表 |
|||
this.Post({},'/api/guide/getGuideLingoList').then(res =>{ |
|||
this.lingoIds = res.data |
|||
this.$store.commit('changeLingoIds', res.data) |
|||
}) |
|||
// 获取景区列表 |
|||
this.Post({},'/api/guide/getGuideScenicList').then(res =>{ |
|||
this.scenicIds = res |
|||
this.$store.commit('changeScenicIds', res.data) |
|||
}) |
|||
}, |
|||
|
|||
// 上传头像 |
|||
uploadAvator () { |
|||
let _this = this |
|||
uni.chooseImage({ |
|||
success: (chooseImageRes) => { |
|||
const tempFilePaths = chooseImageRes.tempFilePaths; |
|||
pathToBase64(tempFilePaths[0]).then(base64 => { |
|||
_this.info.avatar = base64 |
|||
console.log(_this.info) |
|||
}) |
|||
}, |
|||
}) |
|||
}, |
|||
selectSex () { |
|||
let _this = this |
|||
let itemList = ['男','女'] |
|||
let valueList = ['1','2'] |
|||
uni.showActionSheet({ |
|||
itemList: itemList, |
|||
success: function (res) { |
|||
let index = res.tapIndex; |
|||
_this.info.genderStr = itemList[index] |
|||
_this.info.gender = valueList[index] |
|||
|
|||
}, |
|||
fail: function (res) { |
|||
console.log(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
selectRank () { |
|||
let _this = this |
|||
let itemList = this.lingoIds.map(v=>v.name) |
|||
let valueList = this.lingoIds.map(v=>v.id) |
|||
uni.showActionSheet({ |
|||
itemList: itemList, |
|||
success: function (res) { |
|||
let index = res.tapIndex; |
|||
_this.info.group_idStr = itemList[index] |
|||
_this.info.group_id = valueList[index] |
|||
|
|||
}, |
|||
fail: function (res) { |
|||
console.log(res.errMsg); |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
// 跳转修改数据 |
|||
changeValue(valueType) { |
|||
uni.navigateTo({ |
|||
url: `/subPackages/user/infoFilling?valueType=${valueType}&inputValue=${this.info[valueType]}` |
|||
}) |
|||
}, |
|||
|
|||
// 接受回调 |
|||
updateInfo(data) { |
|||
if (data.msgType == 'registerInfo') { |
|||
console.log(data.data) |
|||
let valueType = data.data.valueType |
|||
let valueTypeStr = valueType + 'Str' |
|||
let inputValue = data.data.inputValue |
|||
let inputValueStr = data.data.inputValueStr |
|||
this.info[valueType] = inputValue |
|||
if (this.info[valueTypeStr] !== undefined && inputValueStr) { |
|||
this.info[valueTypeStr] = inputValueStr |
|||
} |
|||
} |
|||
}, |
|||
|
|||
uploadImg() { |
|||
uni.chooseImage({ |
|||
success: (chooseImageRes) => { |
|||
const tempFilePaths = chooseImageRes.tempFilePaths; |
|||
|
|||
// // #ifdef MP-WEIXIN |
|||
// uni.getFileSystemManager().readFile({ |
|||
// filePath: tempFilePaths[0], |
|||
// encoding: 'base64', |
|||
// success: res => { |
|||
// this.Post({ |
|||
// method: 'POST', |
|||
// base64: 'data:image/png;base64,' + res.data |
|||
// }, '/api/common/base64').then(res => { |
|||
// if (res.data) { |
|||
// this.Post({ |
|||
// avatar: res.data |
|||
// }, '/api/user/profile').then(res => { |
|||
// uni.showModal({ |
|||
// title: '提示', |
|||
// content: res.msg, |
|||
// showCancel: false, |
|||
// success: res => { |
|||
// if (res.confirm) { |
|||
// this.getList() |
|||
// } |
|||
// } |
|||
// }) |
|||
// }) |
|||
// } |
|||
// }) |
|||
// } |
|||
// }) |
|||
// // #endif |
|||
|
|||
pathToBase64(tempFilePaths[0]).then(base64 => { |
|||
this.Post({ |
|||
method: 'POST', |
|||
base64: base64 |
|||
}, '/api/common/base64').then(res => { |
|||
if (res.data) { |
|||
this.Post({ |
|||
avatar: res.data |
|||
}, '/api/user/profile').then(res => { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.getList() |
|||
} |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
|
|||
submit() { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '确认修改您的信息？', |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.Post({ |
|||
nickname: this.nickname, |
|||
gender: this.gender, |
|||
birthday: this.birthday |
|||
}, '/api/user/profile').then(res => { |
|||
console.log(res) |
|||
if (res.code == 1) { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: res.msg, |
|||
showCancel: false, |
|||
success: res => { |
|||
if (res.confirm) { |
|||
this.getList() |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
<style scoped lang="scss"> |
|||
view { |
|||
box-sizing: content-box; |
|||
} |
|||
.bg{ |
|||
min-height: 100vh; |
|||
overflow-x: hidden; |
|||
background: white; |
|||
padding-bottom: 50rpx; |
|||
} |
|||
.header-tip{ |
|||
font-weight: 400; |
|||
font-size: 27rpx; |
|||
color: #585858; |
|||
padding: 33rpx 0; |
|||
text-align: center; |
|||
} |
|||
.empty-value{ |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.info-avatar-top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
font-size: 28rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 40rpx 0; |
|||
height: 48rpx; |
|||
color: #333; |
|||
align-items: center; |
|||
} |
|||
.info-avatar-top view{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.info-avatar-top view:after{ |
|||
content: ""; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 6rpx; |
|||
background-image: url('https://static.ticket.sz-trip.com/tongli/images/user/rightIcon-gray.png'); |
|||
background-size: 100% 100%; |
|||
} |
|||
.info-avatar-top img { |
|||
width: 80rpx; |
|||
height: 80rpx; |
|||
border-radius: 50%; |
|||
margin-right: 10rpx; |
|||
} |
|||
|
|||
.change-avatar-btn { |
|||
color: #FFF; |
|||
width: 220rpx; |
|||
margin: 0 auto; |
|||
line-height: 70rpx; |
|||
border-radius: 20rpx; |
|||
background: #4C93FF; |
|||
position: relative; |
|||
font-size: 34rpx; |
|||
} |
|||
|
|||
.change-avatar-btn input { |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
opacity: 0; |
|||
} |
|||
|
|||
.user-other-info { |
|||
margin:0 30rpx; |
|||
.info-title{ |
|||
font-weight: bold; |
|||
font-size: 32rpx; |
|||
color: #000000; |
|||
} |
|||
} |
|||
|
|||
.userinfo-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 28rpx; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
padding: 40rpx 30rpx 40rpx 0; |
|||
height: 48rpx; |
|||
color: #333; |
|||
position: relative; |
|||
} |
|||
|
|||
.info-avatar-top span { |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.userinfo-item span { |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
flex-shrink: 0; |
|||
color: #000; |
|||
width: 200rpx; |
|||
} |
|||
|
|||
.userinfo-item i { |
|||
font-weight: 500; |
|||
font-size: 24rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.userinfo-item { |
|||
& view::after { |
|||
content: ""; |
|||
width: 20rpx; |
|||
height: 20rpx; |
|||
margin-left: 6rpx; |
|||
background-image: url('https://static.ticket.sz-trip.com/tongli/images/user/rightIcon-gray.png'); |
|||
background-size: 100% 100%; |
|||
position: absolute; |
|||
right: 0; |
|||
margin: auto; |
|||
top: 0; |
|||
bottom: 0; |
|||
} |
|||
} |
|||
|
|||
.birthday-box { |
|||
text-align: right; |
|||
} |
|||
|
|||
.cropper { |
|||
width: auto; |
|||
height: 100%; |
|||
} |
|||
|
|||
.cropper-content { |
|||
position: fixed; |
|||
left: 0; |
|||
right: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
z-index: 1000; |
|||
} |
|||
|
|||
.dialog-footer .change-avatar-btn { |
|||
position: fixed; |
|||
text-align: center; |
|||
bottom: 80rpx; |
|||
left: 50%; |
|||
margin-left: -110rpx; |
|||
} |
|||
|
|||
.btn-tao { |
|||
text-align: center; |
|||
font-size: 30rpx; |
|||
width: 697rpx; |
|||
height: 80rpx; |
|||
background: #96684F; |
|||
border-radius: 40rpx; |
|||
line-height: 80rpx; |
|||
color: #FFFFFF; |
|||
margin-top: 55rpx; |
|||
} |
|||
|
|||
.popup-box { |
|||
border-radius: 20rpx 20rpx 0rpx 0rpx; |
|||
background: #fff; |
|||
overflow: hidden; |
|||
|
|||
.popup-item { |
|||
width: 697rpx; |
|||
height: 99rpx; |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
color: #12293C; |
|||
margin: auto; |
|||
} |
|||
.popup-item:nth-child(2) { |
|||
border: none; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
border-top: 1rpx solid #D8D8D8; |
|||
} |
|||
|
|||
.popup-items { |
|||
width: 100%; |
|||
height: 99rpx; |
|||
font-weight: 500; |
|||
font-size: 31rpx; |
|||
color: #12293C; |
|||
border-top: 13rpx solid #F2F2F2; |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue