commit message

buyer/src/pages/home/memberCenter/Profile.vue

@@ -0,0 +1,90 @@
+<template>
+  <div class="wrapper">
+    <card _Title="用户信息" />
+    <Form :model="formItem" :rules="rules" ref="form" :label-width="80">
+      <FormItem label="头像">
+        <Avatar v-if="formItem.face" :src="formItem.face" size="80"/>
+        <Avatar v-else icon="ios-person" size="80"/>
+        <Upload
+          :show-upload-list="false"
+          :on-success="handleSuccess"
+          :before-upload="handleBeforeUpload"
+          :format="['jpg','jpeg','png']"
+          :action="action"
+          :headers="accessToken"
+          >
+          <Button class="mt_10">上传头像</Button>
+        </Upload>
+      </FormItem>
+      <FormItem label="昵称" prop="nickName">
+        <Input class="wrapper-user-name" style="width:187px" v-model="formItem.nickName" placeholder="" />
+      </FormItem>
+
+      <FormItem label="生日">
+        <DatePicker type="date" placeholder="选择您的生日" v-model="formItem.birthday"></DatePicker>
+      </FormItem>
+      <FormItem label="性别">
+        <RadioGroup v-model="formItem.sex">
+          <Radio :label="1">男</Radio>
+          <Radio :label="0">女</Radio>
+        </RadioGroup>
+      </FormItem>
+      <FormItem>
+        <Button type="primary" @click="save">确认修改</Button>
+
+      </FormItem>
+    </Form>
+  </div>
+</template>
+
+<script>
+import storage from '@/plugins/storage.js';
+import { editMemberInfo } from '@/api/account.js';
+import { commonUrl } from '@/plugins/request.js';
+export default {
+  name: 'Profile',
+  data () {
+    return {
+      rules: { // 验证规则
+        nickName: [{required: true, message: '用户昵称不能为空'}, { max: 16, message: '用户昵称不能超过15个字符' }]
+      },
+      formItem: {}, // 表单数据
+      action: commonUrl + '/common/upload/file', // 上传接口
+      accessToken: {} // 验证token
+    }
+  },
+  mounted () {
+    this.formItem = JSON.parse(storage.getItem('userInfo'))
+    this.accessToken.accessToken = storage.getItem('accessToken');
+  },
+  methods: {
+    save () {
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          let params = {
+            birthday: this.$options.filters.unixToDate(this.formItem.birthday / 1000, 'yyyy-MM-dd'),
+            face: this.formItem.face,
+            nickName: this.formItem.nickName,
+            sex: this.formItem.sex
+          }
+          editMemberInfo(params).then(res => {
+            if (res.success) {
+              this.$Message.success('修改个人资料成功')
+              storage.setItem('userInfo', res.result)
+            }
+          })
+        }
+      })
+    },
+    handleSuccess (res, file) {
+      this.$set(this.formItem, 'face', res.result)
+    },
+    handleBeforeUpload () {}
+  }
+
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>