修改页面
This commit is contained in:
浅念
+121
-27
@@ -3,16 +3,18 @@
|
||||
<uni-nav-bar leftText=" " :fixed="true" :border="false" leftIcon="back" @clickLeft="leftClick" color="#000000" backgroundColor="#fff" :statusBar="true" :title="$t('navbar.persondata')"></uni-nav-bar>
|
||||
<view class="content">
|
||||
<view class="topimg">
|
||||
<image class="user" src="/static/image/mine/user.png" mode=""></image>
|
||||
<image class="xj" src="/static/image/mine/xiangji.png" mode=""></image>
|
||||
<view>{{$t('mine.changeavatar')}}</view>
|
||||
<uni-file-picker fileMediatype="image" limit="1" :list-styles="imageStyles" :del-icon="false" disable-preview @select="select" @delete="delfn('picture')">
|
||||
<image class="user" :src="userinfo.avatar==''||userinfo.avatar==null||userinfo.avatar=='null'?'/static/image/mine/user.png':userinfo.avatar"mode=""></image>
|
||||
<!-- <image class="xj" src="/static/image/mine/xiangji.png" mode=""></image> -->
|
||||
</uni-file-picker>
|
||||
<view>{{$t('mine.changeavatar')}}</view>
|
||||
</view>
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('gender')}}</view>
|
||||
<view class="right">
|
||||
<u-radio-group v-model="userinfo.gender">
|
||||
<u-radio name="1" class="m-r-10">{{$t('gender1')}}</u-radio>
|
||||
<u-radio name="2">{{$t('gender2')}}</u-radio>
|
||||
<u-radio-group v-model="userinfo.sex">
|
||||
<u-radio :name="Number(1)" class="m-r-10">{{$t('gender1')}}</u-radio>
|
||||
<u-radio :name="Number(2)">{{$t('gender2')}}</u-radio>
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
@@ -20,28 +22,53 @@
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('mine.nickname')}}</view>
|
||||
<view class="right">
|
||||
<input :placeholder="$t('mine.nicknameinputhd')" v-model="userinfo.nickname"></input>
|
||||
<input :placeholder="$t('mine.nicknameinputhd')" v-model="userinfo.name"></input>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider text=""></u-divider>
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('mine.lxcall')}}</view>
|
||||
<view class="right">
|
||||
<input :placeholder="$t('mine.lxcallinputhd')" type="number" v-model="userinfo.phone"></input>
|
||||
<input :placeholder="$t('mine.lxcallinputhd')" type="number" v-model="userinfo.mobile"></input>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider text=""></u-divider>
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('mine.position')}}</view>
|
||||
<view class="right">
|
||||
<input :placeholder="$t('mine.positioninput')" type="text" v-model="userinfo.position"></input>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="cell1">
|
||||
<view class="item">{{$t('Region')}}</view>
|
||||
<view class="right select">
|
||||
<input :placeholder="$t('Regioninputhd')" v-model="userinfo.company"></input>
|
||||
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('customer.Company')}}</view>
|
||||
<view class="right select" @click="showcomp = true">
|
||||
<view class="" :class="['content2', { placeholder: !company_name }]">{{company_name || $t('inputnl')}}</view>
|
||||
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider text=""></u-divider>
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('customer.Country')}}</view>
|
||||
<view class="right select" @click="showarea = true">
|
||||
<view class="" :class="['content2', { placeholder: !country_name }]">{{country_name || $t('customer.Countryinput')}}</view>
|
||||
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="foot">
|
||||
<button class="btn" @click="bcFn">{{$t('save')}}</button>
|
||||
</view>
|
||||
<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexgj" :show="showarea" @cancel="cancel('showarea')" @close="close('showarea')" :columns="areaList" keyName="name" @confirm="areaChange"></u-picker>
|
||||
<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :defaultIndex="defaultIndexgs" :show="showcomp" @cancel="cancel('showcomp')" @close="close('showcomp')" :columns="company" keyName="name" @confirm="companyChange"></u-picker>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
@@ -49,39 +76,94 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showarea: false,
|
||||
showcomp: false,
|
||||
country_name:'',
|
||||
areaList1:[],
|
||||
areaList:[],
|
||||
defaultIndexgj:[0],
|
||||
company_name:'',
|
||||
company:[],
|
||||
company1:[],
|
||||
defaultIndexgs:[0],
|
||||
imageStyles: {
|
||||
width: 40,
|
||||
height: 40,
|
||||
border: {
|
||||
radius: '50%'
|
||||
}
|
||||
},
|
||||
userinfo:{
|
||||
nickname:'',
|
||||
avatar:'',
|
||||
company:'',
|
||||
phone:'',
|
||||
border: true,
|
||||
},
|
||||
userinfo:{},
|
||||
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.area()
|
||||
this.companyfn()
|
||||
this.getinfo()
|
||||
},
|
||||
methods: {
|
||||
getinfo(){
|
||||
var that= this;
|
||||
request({
|
||||
url:'api/user/info',
|
||||
method:'POST',
|
||||
url:'user/getInfo',
|
||||
method:'get',
|
||||
}).then(res => {
|
||||
that.userinfo = res.data.data
|
||||
that.userinfo = res.data.data;
|
||||
that.select1()
|
||||
})
|
||||
},
|
||||
select1(){
|
||||
var that=this;
|
||||
that.areaList1.forEach((item,index) => {
|
||||
if(item.id == that.userinfo.country_id){
|
||||
that.country_name = item.name
|
||||
that.defaultIndexgj=[index]
|
||||
console.log(that.country_name)
|
||||
}
|
||||
})
|
||||
that.company1.forEach((item,index) => {
|
||||
if(item.id == that.userinfo.sign){
|
||||
that.company_name = item.name
|
||||
that.defaultIndexgs=[index]
|
||||
}
|
||||
})
|
||||
},
|
||||
//国家切换事件
|
||||
areaChange(val){
|
||||
this.userinfo.country_id = val.value[0].id
|
||||
this.country_name = val.value[0].name
|
||||
this.showarea = false
|
||||
},
|
||||
//国家
|
||||
area(){
|
||||
request({
|
||||
url:'area/getCountry',
|
||||
method:'get',
|
||||
}).then(res => {
|
||||
var list = res.data.data
|
||||
this.areaList1 = list
|
||||
this.areaList = [list]
|
||||
this.select1()
|
||||
})
|
||||
},
|
||||
//公司
|
||||
companyfn(){
|
||||
request({
|
||||
url:'feishu/getSign',
|
||||
method:'get',
|
||||
}).then(res => {
|
||||
var list = res.data.data
|
||||
this.company1 = list
|
||||
this.company = [list]
|
||||
this.select1()
|
||||
})
|
||||
},
|
||||
companyChange(val){
|
||||
this.userinfo.sign = val.value[0].id
|
||||
this.company_name = val.value[0].name
|
||||
this.showcomp = false
|
||||
},
|
||||
uploadfn(imgUrl){
|
||||
var that = this;
|
||||
uni.uploadFile({
|
||||
url: 'https://api.collect.hs.hnzhwlkj.club/api/upload/image',
|
||||
url: 'http://219.157.255.213:9007/upload/uploadImage',
|
||||
filePath: imgUrl,
|
||||
name: 'image',
|
||||
header:{'content-type': 'application/x-www-form-urlencoded','Authorization': 'Bearer ' + uni.getStorageSync('token')},
|
||||
@@ -92,6 +174,12 @@
|
||||
}
|
||||
});
|
||||
},
|
||||
cancel(val){
|
||||
this[val] = false
|
||||
},
|
||||
close(val){
|
||||
this[val] = false
|
||||
},
|
||||
delfn(){
|
||||
that.userinfo.avatar =''
|
||||
},
|
||||
@@ -105,13 +193,16 @@
|
||||
},
|
||||
bcFn(){
|
||||
request({
|
||||
url:'api/user/update',
|
||||
url:'user/save',
|
||||
method:'POST',
|
||||
data:{
|
||||
nickname:this.userinfo.nickname,
|
||||
avatar:this.userinfo.avatar,
|
||||
company:this.userinfo.company,
|
||||
phone:this.userinfo.phone
|
||||
sex:this.userinfo.sex,
|
||||
name:this.userinfo.name,
|
||||
mobile:this.userinfo.mobile,
|
||||
position:this.userinfo.position,
|
||||
country_id:this.userinfo.country_id,
|
||||
sign:this.userinfo.sign,
|
||||
}
|
||||
}).then(res => {
|
||||
uni.showToast({
|
||||
@@ -133,6 +224,9 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.uni-file-picker {
|
||||
margin-left: 33.3%;
|
||||
}
|
||||
.m-r-10{
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user