|
@@ -4,17 +4,20 @@
|
|
<view class="one">
|
|
<view class="one">
|
|
<uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
|
|
<uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
|
|
<uni-forms-item label="头像" name="icon">
|
|
<uni-forms-item label="头像" name="icon">
|
|
- <upload :list="icon" name="icon" :count="1" @uplSuc="uplSuc" @uplDel="uplDel"></upload>
|
|
|
|
|
|
+ <view class="icon">
|
|
|
|
+ <view class="icon_1" v-if="form.icon&&form.icon.length>0">
|
|
|
|
+ <image class="image" v-for="i in form.icon" :key="i" :src="i.url" mode=""></image>
|
|
|
|
+ <uni-icons class="del" type="close" size="30" color="#ff0000" @click="iconDel()"></uni-icons>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="icon_2" v-else>
|
|
|
|
+ <button open-type="chooseAvatar" @chooseavatar="chooseavatar">上传头像</button>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
</uni-forms-item>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="用户名" name="name">
|
|
<uni-forms-item label="用户名" name="name">
|
|
- <uni-easyinput type="text" v-model="form.name" placeholder="请输入用户名" />
|
|
|
|
|
|
+ <input class="input" type="nickname" :value="form.name" placeholder="请输入用户名" @input="nameInput">
|
|
|
|
+ <!-- <uni-easyinput type="nick" v-model="form.name" placeholder="请输入用户名" /> -->
|
|
</uni-forms-item>
|
|
</uni-forms-item>
|
|
- <!-- <uni-forms-item label="手机号" name="phone">
|
|
|
|
- <uni-easyinput type="text" v-model="form.phone" placeholder="请输入手机号" disabled />
|
|
|
|
- </uni-forms-item>
|
|
|
|
- <uni-forms-item label="电子邮箱" name="email">
|
|
|
|
- <uni-easyinput type="text" v-model="form.email" placeholder="请输入电子邮箱" disabled />
|
|
|
|
- </uni-forms-item> -->
|
|
|
|
<uni-forms-item label="性别" name="gender">
|
|
<uni-forms-item label="性别" name="gender">
|
|
<picker @change="genderChange" name="gender" :value="form.gender" :range="genderList" range-key="label">
|
|
<picker @change="genderChange" name="gender" :value="form.gender" :range="genderList" range-key="label">
|
|
<view class="uni-input">{{form.zhGender||'请选择性别'}}</view>
|
|
<view class="uni-input">{{form.zhGender||'请选择性别'}}</view>
|
|
@@ -46,7 +49,9 @@
|
|
frameStyle: {
|
|
frameStyle: {
|
|
useBar: false
|
|
useBar: false
|
|
},
|
|
},
|
|
- form: {},
|
|
|
|
|
|
+ form: {
|
|
|
|
+ icon: []
|
|
|
|
+ },
|
|
rules: {
|
|
rules: {
|
|
name: {
|
|
name: {
|
|
rules: [{
|
|
rules: [{
|
|
@@ -61,30 +66,17 @@
|
|
}]
|
|
}]
|
|
},
|
|
},
|
|
},
|
|
},
|
|
- genderList: [
|
|
|
|
- // {
|
|
|
|
- // label: '保密',
|
|
|
|
- // value: '0'
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // label: '男',
|
|
|
|
- // value: '1'
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // label: '女',
|
|
|
|
- // value: '2'
|
|
|
|
- // },
|
|
|
|
- ],
|
|
|
|
- icon: []
|
|
|
|
|
|
+ genderList: [],
|
|
|
|
+
|
|
};
|
|
};
|
|
},
|
|
},
|
|
- onLoad:async function(e) {
|
|
|
|
|
|
+ onLoad: async function(e) {
|
|
const that = this;
|
|
const that = this;
|
|
await that.searchOther();
|
|
await that.searchOther();
|
|
that.watchLogin();
|
|
that.watchLogin();
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
- async searchOther(){
|
|
|
|
|
|
+ async searchOther() {
|
|
const that = this;
|
|
const that = this;
|
|
let res;
|
|
let res;
|
|
res = await that.$api(`/dictData`, 'GET', {
|
|
res = await that.$api(`/dictData`, 'GET', {
|
|
@@ -107,8 +99,6 @@
|
|
.gender)
|
|
.gender)
|
|
if (gender) arr.data.zhGender = gender.label;
|
|
if (gender) arr.data.zhGender = gender.label;
|
|
that.$set(that, `form`, arr.data)
|
|
that.$set(that, `form`, arr.data)
|
|
-
|
|
|
|
- that.$set(that, `icon`, arr.data.icon)
|
|
|
|
} else {
|
|
} else {
|
|
uni.showToast({
|
|
uni.showToast({
|
|
title: arr.errmsg,
|
|
title: arr.errmsg,
|
|
@@ -126,17 +116,35 @@
|
|
url: `/${e.route}`
|
|
url: `/${e.route}`
|
|
})
|
|
})
|
|
},
|
|
},
|
|
- // 图片上传
|
|
|
|
- uplSuc(e) {
|
|
|
|
|
|
+ // 删除头像
|
|
|
|
+ iconDel() {
|
|
const that = this;
|
|
const that = this;
|
|
- that.$set(that, `${e.name}`, [...that[e.name], e.data]);
|
|
|
|
|
|
+ that.$set(that.form, `icon`, [])
|
|
|
|
+ },
|
|
|
|
+ // 头像上传
|
|
|
|
+ async chooseavatar(e) {
|
|
|
|
+ const that = this;
|
|
|
|
+ let avatarUrl = e.detail.avatarUrl;
|
|
|
|
+ let serverUrl = that.$config.serverUrl;
|
|
|
|
+ const res = await that.$apifile(`/point/upload`, 'file', avatarUrl, 'file');
|
|
|
|
+ if (res.errcode == '0') {
|
|
|
|
+ let obj = {
|
|
|
|
+ name: res.name,
|
|
|
|
+ uri: res.uri,
|
|
|
|
+ url: serverUrl + res.uri
|
|
|
|
+ }
|
|
|
|
+ that.$set(that.form, `icon`, [obj])
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.errmsg,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
},
|
|
},
|
|
- // 图片删除
|
|
|
|
- uplDel(e) {
|
|
|
|
|
|
+ // 选择,输入昵称
|
|
|
|
+ nameInput(e) {
|
|
const that = this;
|
|
const that = this;
|
|
- let data = that[e.name];
|
|
|
|
- let arr = data.filter((i, index) => index != e.data.index);
|
|
|
|
- that.$set(that, `${e.name}`, arr)
|
|
|
|
|
|
+ that.$set(that.form, `name`, e.detail.value);
|
|
},
|
|
},
|
|
// 选择性别
|
|
// 选择性别
|
|
genderChange(e) {
|
|
genderChange(e) {
|
|
@@ -162,7 +170,6 @@
|
|
onSubmit(ref) {
|
|
onSubmit(ref) {
|
|
const that = this;
|
|
const that = this;
|
|
that.$refs[ref].validate().then(async params => {
|
|
that.$refs[ref].validate().then(async params => {
|
|
- params.icon = that.icon
|
|
|
|
const arr = await that.$api(`/user/${that.form.id}`, 'POST', params);
|
|
const arr = await that.$api(`/user/${that.form.id}`, 'POST', params);
|
|
if (arr.errcode == '0') {
|
|
if (arr.errcode == '0') {
|
|
uni.showToast({
|
|
uni.showToast({
|
|
@@ -197,6 +204,12 @@
|
|
border-radius: 1vw;
|
|
border-radius: 1vw;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ .input {
|
|
|
|
+ border: #f1f1ff 1px solid;
|
|
|
|
+ padding: 1.5vw 1vw;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ }
|
|
|
|
+
|
|
.btn {
|
|
.btn {
|
|
text-align: center;
|
|
text-align: center;
|
|
|
|
|
|
@@ -211,6 +224,35 @@
|
|
font-size: var(--font14Size);
|
|
font-size: var(--font14Size);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+ .icon {
|
|
|
|
+ display: flex;
|
|
|
|
+
|
|
|
|
+ .icon_1 {
|
|
|
|
+ position: relative;
|
|
|
|
+
|
|
|
|
+ .image {
|
|
|
|
+ width: 30vw;
|
|
|
|
+ height: 30vw;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .del {
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 0;
|
|
|
|
+ left: 22vw;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .icon_2 {
|
|
|
|
+ text-align: left;
|
|
|
|
+
|
|
|
|
+ button {
|
|
|
|
+ width: 30vw;
|
|
|
|
+ padding: 0vw 1vw;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|