登录及个人中心

src/components/global-component/citypick/CityPick.vue

@@ -9,7 +9,7 @@
          <el-option
            v-for="item in provs"
            :label="item.text"
            :value="item.text"
            :value="item.value"
            :key="item.index">
          </el-option>
        </el-select>
@@ -24,7 +24,7 @@
        <el-option
          v-for="item in citys"
          :label="item.text"
          :value="item.text"
          :value="item.value"
          :key="item.index">
        </el-option>
      </el-select>
@@ -65,6 +65,13 @@
      },
      city() {
        if (this.city) {
          if (this.citys.length === 0) {
            for (var val of this.provs) {
              if (this.prov === val.value) {
                this.citys = val.children;
              };
            };
          }
          this.selectCity = this.city;
        };
      }
@@ -75,19 +82,17 @@
        this.citys = [];
        this.selectCity = '';
        for (var val of this.provs) {
          if (prov === val.text) {
          if (prov === val.value) {
            tempCity = val.children;
          };
        };
        this.citys = tempCity;
        this.$emit('selectProv', this.selectProv);
        this.$emit('selectCity', this.selectCity);
      },
      getCity(city) {
        console.log(city);
        console.log(this.selectCity);
        this.$emit('selectProv', this.selectProv);
        this.$emit('selectCity', this.selectCity);
        this.$emit('selectProv', this.selectCity);
      },
      resetProvCity() {
        this.selectProv = '';

src/components/uploadFile/index.vue

@@ -0,0 +1,148 @@
<template>
  <div class="upload-box">
    <div class="el-upload-list el-upload-list--picture-card">
      <div class="el-upload-list__item is-success" v-for="(imgIt,imgIndex) in imageUrl" :key="imgIt.index" :style="{ width: uploadImg.width, height: uploadImg.height }">
        <img class="flex-img__image" :src="imgIt" :style="{ maxWidth: uploadImg.width, maxHeight: uploadImg.height }">
        <label class="el-upload-list__item-status-label">
          <i class="el-icon-upload-success el-icon-check"></i>
        </label>
        <span class="el-upload-list__item-actions">
          <span class="el-upload-list__item-delete">
            <i class="el-icon-delete" @click.stop="handleRemove(imgIndex)"></i>
          </span>
        </span>
      </div>
    </div>
    <el-upload class="avatar-uploader" :action="uploadImg.url" v-show="!plusShow" :show-file-list="false" :on-success="handleAvatarSuccess"
      :before-upload="beforeAvatarUpload" :style="{ width: uploadImg.width, height: uploadImg.height }">
      <i class="el-icon-plus avatar-uploader-icon" :style="{ width: uploadImg.width, height: uploadImg.height, lineHeight: uploadImg.height }">
        <div slot="tip" class="el-upload__tip" align="center" :style="{ width: uploadImg.width }">
          <div>{{uploadImg.tip || ''}}</div>
          <div>PNG/JPG/JPEG格式<br />2M以内</div>
        </div>
      </i>
    </el-upload>
  </div>
</template>
<script>
  /* 使用说明
   * imgsArr: [], // 数据动态回显图片数组
   * uploadImg: {
   *  url: uploadLogo, // upload--action
   *  tip: '上传平台LOGO图片', // 上传图片的提示tip
   *  width: '280px',
   *  height: '200px',
   *  fun: 'uploadfun',
   *  limit: 3 //最多可以传输数量
   * }
  */
  import util from '@/libs/util'
  export default {
    props: ['upImgsStr', 'uploadImg'],
    data() {
      return {
        imageUrl: util.strToArr(this.upImgsStr) || []
      }
    },
    watch: {
      upImgsStr(value) {
        console.log(value)
        this.imageUrl = util.strToArr(value)
      },
      imageUrl(value) {
        const list = util.arrToStr(value)
        this.$emit('uploadfun', list)
      }
    },
    computed: {
      limitNum() {
        return this.uploadImg.limit || 1
      },
      plusShow() { // 当图片多于N张的时候，就隐藏上传框
        if (this.imageUrl) {
          return this.imageUrl.length >= this.limitNum
        } else {
          return false
        }
      }
    },
    methods: {
      handleRemove(index) {
        this.imageUrl.splice(index, 1)
      },
      handleAvatarSuccess(res) {
        this.imageUrl.push(res.data.uri)
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg'
        const isPNG = file.type === 'image/png'
        const isLt2M = file.size / 1024 / 1024 < 2
        if (!isJPG && !isPNG) {
          this.$message.error('只能上传jpg/jpeg/png格式的图片，请重新上传')
        }
        if (!isLt2M) {
          this.$message.error('图片大小不能超过2MB，请重新上传')
        }
        return isJPG && isLt2M
      }
    }
  }
</script>
<style>
  .upload-box {
    display: flex;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .el-upload--picture-card {
    width: 100%;
    height: 100%;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    text-align: center;
  }
  .el-icon-plus:before {
    bottom: 10%;
    position: relative;
  }
  .avatar {
    display: block;
  }
  .el-upload__tip {
    position: absolute;
    bottom: 12%;
    padding: 10px;
    line-height: 16px;
    z-index: 0;
  }
  .el-upload-list--picture-card {
    overflow: hidden;
  }
  .el-upload-list--picture-card .el-upload-list__item {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
  }
  .el-upload-list--picture-card .el-upload-list__item-thumbnail {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }
</style>

src/libs/axios.js

@@ -11,7 +11,7 @@ axiosUtil.interceptors.request.use(function (config) {
    if (config.method === 'post') {
      config.data = qs.stringify(config.data, {arrayFormat: 'repeat'});
      // 处理后后台无需添加RequestBody
      config.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
      config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
    };
    return config;
});

src/permission.js

@@ -0,0 +1,43 @@
import router from './router'
import store from './store'
import { Message } from 'element-ui'
import Cookies from 'js-cookie'
const whiteList = ['/publishProduct', '/companyProduct', '/companyInformation', '/myDemand', '/examineDemand', '/modifyDemand', '/modifyData', '/modifyPassword', '/attentionCollect'] // 不重定向白名单
router.beforeEach((to, from, next) => {
  if (Cookies.get('userid')) {
    if (to.path === '/loginPlat') {
      next({ path: '/home' });
    } else {
      if (!store.getters.account) { // 判断当前用户是否已拉取完user_info信息
        store.dispatch('GetUserInfo').then(res => { // 拉取user_info
          if (res.success && res.data) {
            next();
          } else {
            store.dispatch('FedLogOut').then(() => {
              if (whiteList.indexOf(to.path) !== -1) {
                Message.error('登录状态失效，请重新登录');
                router.push({ path: '/loginPlat' });
              } else {
                next();
              }
            })
          }
        }).catch((err) => {
          store.dispatch('FedLogOut').then(() => {
            Message.error(err || '登录状态失效，请重新登录');
            next({ path: '/loginPlat' })
          })
        })
      } else {
        next();
      }
    }
  } else {
    if (whiteList.indexOf(to.path) !== -1) {
      router.push({ path: '/loginPlat' });
    } else {
      next();
    }
  }
})

src/store/getters.js

@@ -1,4 +1,7 @@
const getters = {
  pinfo: state => state.plat.pinfo
  pinfo: state => state.plat.pinfo,
  account: state => state.user.account,
  bindCompany: state => state.user.bindCompany,
  headPhoto: state => state.user.headPhoto
};
export default getters;

src/store/index.js

@@ -1,13 +1,15 @@
import Vue from 'vue';
import Vuex from 'vuex';
import plat from './modules/plat';
import user from './modules/user';
import getters from './getters';
Vue.use(Vuex);
const store = new Vuex.Store({
  modules: {
    plat
    plat,
    user
  },
  getters
});

src/store/modules/user.js

@@ -1,14 +1,13 @@
import { login, logout, getInfo } from '@/api/login'
import { getCookiesName, setCookiesName, removeCookiesName } from '@/utils/auth'
import http from '@/libs/axios'
import Cookies from 'js-cookie'
import util from '@/libs/util'
const user = {
  state: {
    account: '',
    userid: '',
    name: '',
    roles: [],
    logins: '',
    session: getCookiesName()
    bindCompany: '',
    headPhoto: ''
  },
  mutations: {
    SET_ACCOUNT: (state, account) => {
@@ -17,61 +16,31 @@ const user = {
    SET_USERID: (state, userid) => {
      state.userid = userid
    },
    SET_NAME: (state, name) => {
      state.name = name
    SET_BINDCOMPANY: (state, bindCompany) => {
      state.bindCompany = bindCompany
    },
    SET_ROLES: (state, roles) => {
      state.roles = roles
    },
    SET_LOGIN: (state, logins) => {
      state.logins = logins
    },
    SET_SESSION: (state, session) => {
      state.session = session
    SET_HEADPHOTO: (state, headPhoto) => {
      state.headPhoto = headPhoto || util.defaultSet.img.expert;
    }
  },
  actions: {
    // 用户名登录
    LoginByUsername({ commit }, userInfo) {
      const account = userInfo.username.trim()
      const pw = userInfo.password
      const vc = userInfo.imgVerifyCode.toLocaleUpperCase()
      return new Promise((resolve, reject) => {
        login(account, pw, vc).then((response) => {
          if (response.success) {
            if (response.data) {
              const dataS = response.data
              if (dataS.active) {
                commit('SET_ACCOUNT', dataS.account)
                commit('SET_USERID', dataS.id)
                commit('SET_ROLES', [dataS.type.toString()])
                commit('SET_NAME', dataS.name)
                setCookiesName(dataS.name)
              }
            }
          }
          resolve(response)
        }).catch(error => {
          reject(error)
        })
      })
    },
    // 获取用户信息
    GetUserInfo({ commit, state }) {
      return new Promise((resolve, reject) => {
        getInfo().then(response => {
          if (response.success) {
            if (response.data) {
              const dataS = response.data
              if (dataS.active) {
                commit('SET_ACCOUNT', dataS.account)
                commit('SET_USERID', dataS.id)
                commit('SET_ROLES', [dataS.type.toString()])
                commit('SET_NAME', dataS.name)
              }
            }
        http.get('/ajax/sys/user').then(response => {
          if (response.data) {
            const dataS = response.data
            commit('SET_USERID', dataS.id);
            commit('SET_ACCOUNT', dataS.account);
            commit('SET_HEADPHOTO', dataS.head);
            commit('SET_BINDCOMPANY', dataS.bindCompany);
            Cookies.set('userid', dataS.id);
          } else {
            commit('SET_USERID', '')
            commit('SET_ACCOUNT', '')
            commit('SET_HEADPHOTO', '');
            Cookies.remove('userid')
          }
          resolve(response)
        }).catch(error => {
@@ -83,13 +52,12 @@ const user = {
    // 登出
    LogOut({ commit, state }) {
      return new Promise((resolve, reject) => {
        logout().then(() => {
          commit('SET_ACCOUNT', '')
        http.get('/ajax/sys/logout').then(() => {
          commit('SET_USERID', '')
          commit('SET_ROLES', [])
          commit('SET_NAME', '')
          commit('SET_SESSION', '')
          removeCookiesName()
          commit('SET_ACCOUNT', '')
          commit('SET_BINDCOMPANY', '')
          commit('SET_HEADPHOTO', '');
          Cookies.remove('userid')
          resolve()
        }).catch(error => {
          reject(error)
@@ -100,8 +68,11 @@ const user = {
    // 前端 登出
    FedLogOut({ commit }) {
      return new Promise(resolve => {
        commit('SET_SESSION', '')
        removeCookiesName()
        commit('SET_USERID', '')
        commit('SET_ACCOUNT', '')
        commit('SET_BINDCOMPANY', '')
        commit('SET_HEADPHOTO', '');
        Cookies.remove('userid')
        resolve()
      })
    }

src/views/logforms/Captcha.vue

@@ -1,40 +1,86 @@
<template>
<el-dialog title="请完成验证" :visible.sync="dialogFormVisible" width="460px">
  <el-form :model="form">
    <el-form-item>
      <el-input v-model="form.name" autocomplete="off" placeholder="请输入图片验证码" class="imageCode"></el-input>
      <img src="/ajax/PictureVC" class="frmtypeW">
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
  </div>
</el-dialog>
  <el-dialog title="请完成验证" :visible.sync="dialogFormVisible" width="460px" @closed="resetCode">
    <el-form :model="form" :rules="rules" ref="form">
      <el-form-item prop="vc">
        <el-input v-model="form.vc" autocomplete="off" placeholder="请输入图片验证码" class="imageCode"></el-input>
        <img :src="src" class="frmtypeW" @click.stop="refreshImageCode">
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="resetCode">取 消</el-button>
      <el-button type="primary" @click="submitForm('form')">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
  export default {
    props: ['phone'],
    data() {
      return {
        src: '',
        dialogFormVisible: false,
        form: {
          name: ''
          vc: '',
          phone: ''
        },
        rules: {
          vc: [
            { required: true, message: '请输入验证码' }
          ]
        }
      };
    },
    methods: {
        capShow() {
            this.dialogFormVisible = !this.dialogFormVisible;
        }
      resetCode() {
        this.$refs.form.resetFields();
        this.dialogFormVisible = false;
      },
      refreshImageCode() {
        this.src = `/ajax/PictureVC?flag=PIC_REG&time=${new Date().getTime()}`;
      },
      capShow() {
        this.refreshImageCode();
        this.dialogFormVisible = !this.dialogFormVisible;
      },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.form.phone = this.phone;
            this.form.vc = this.form.vc.toUpperCase();
            this.$axios.post('ajax/sys/registe/phone/msg', this.form, res => {
              if (res.success) {
                this.$emit('touchSetin');
                this.resetCode();
              } else {
                const errMsg = {
                  '-60001': '验证超时',
                  '-60003': '验证码错误，请重新输入',
                  '0': '一小时内发送短信次数超过限制，请稍后再试'
                }
                this.$message.error(errMsg[res.code]);
                this.refreshImageCode();
              }
            })
          } else {
            return false;
          }
        });
      }
    }
  };
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
  .frmtypeW
    float: right
  .imageCode
    width: 70%
  .dialog-footer
<style lang="scss" rel="stylesheet/scss" scoped>
  .frmtypeW {
    float: right;
    cursor: pointer;
  }
  .imageCode {
    width: 70%;
  }
  .dialog-footer {
    text-align: center
  }
</style>

src/views/logforms/enteringRegister.vue

@@ -3,53 +3,94 @@
    <div class="logo-wrapper"></div>
    <div class="form-wrapper">
      <div class="form-contain">
        <p class="form-title">北京科袖科技有限公司</p>
        <p class="form-title">{{$route.query.orgName}}</p>
        <p class="form-title">欢迎入驻平台</p>
        <p class="promptText">请先绑定手机并设置密码</p>
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
          <el-form-item prop="phone">
            <el-input v-model="ruleForm.phone" placeholder="请输入手机号码"></el-input>
          </el-form-item>
          <el-form-item prop="pass">
            <el-input type="password" v-model="ruleForm.pass" placeholder="请输入登录密码" auto-complete="off"></el-input>
          <el-form-item prop="pw">
            <el-input type="password" v-model="ruleForm.pw" placeholder="请输入登录密码" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item prop="mail">
            <el-input v-model="ruleForm.mail" placeholder="请输入短信验证码" class='codeWidth'></el-input>
            <el-button type="primary" class='codeWidth codeButton'>获取短信验证码</el-button>
          <el-form-item prop="vc">
            <el-input v-model="ruleForm.vc" placeholder="请输入短信验证码" class='codeWidth'></el-input>
            <el-button type="primary" class='codeWidth codeButton' :disabled='isDisabled' @click="buttonCheck">{{buttonMsg}}</el-button>
          </el-form-item>
          <el-form-item>
            <i class="el-icon-check successSelect"></i><span class="protocol">我已阅读并同意<a href='#/userAgreement'>《邢台科技条件平台用户协议》</a></span>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" :disabled="isDisabl" :loading="logining" @click="submitForm('ruleForm')">绑定</el-button>
            <el-button type="primary" :disabled="isDisabl" :loading="logining" @click="submitForm('ruleForm')">注册</el-button>
            <div class='existing-account'>已有账号<a href="#/loginPlat">立即登录</a></div>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <Captcha ref="obj"></Captcha>
    <Captcha ref="obj" :phone="ruleForm.phone" v-on:touchSetin="touchSetin"></Captcha>
  </div>
</template>
<script type="text/ecmascript-6">
  import httpUrl from '@/libs/http';
  import Captcha from './Captcha.vue';
  import Cookies from 'js-cookie';
  export default {
     data() {
      let validatePhone = (rule, value, callback) => {
        const pattern = /^1[34578]\d{9}$/;
        if (value === '') {
          this.phoneFlag = false;
          callback(new Error('请输入您的手机号码'));
        } else {
          if (!pattern.test(value)) {
            this.phoneFlag = false;
            callback(new Error('请输入正确的手机号码'));
          } else {
            let phone = this.ruleForm.phone;
            this.$axios.get('/ajax/sys/user/exists', { phone }, response => {
              if (response.success && response.data) {
                this.phoneFlag = false;
                callback(new Error('该账号已存在，请重新输入'))
              } else {
                this.phoneFlag = true;
                callback();
              }
            });
          }
        }
      };
      let validatePw = (rule, value, callback) => {
        const reg = /^[a-zA-Z0-9]{6,24}$/
        if (value === '') {
          callback(new Error('请设置您的登录密码'));
        } else {
          if (!reg.test(value)) {
            callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
          } else {
            callback();
          }
        }
      }
      return {
        logining: false,
        isDisabl: false,
        isDisabled: false,
        buttonMsg: '获取短信验证码',
        phoneFlag: false,
        ruleForm: {
          mail: '',
          pass: ''
          phone: '',
          vc: '',
          pw: ''
        },
        rules: {
          mail: [
            { required: true, message: '请输入邮箱账号', trigger: 'blur' },
            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur'] }
          phone: [
            { required: true, validator: validatePhone, trigger: 'blur' }
          ],
          pw: [
            { required: true, validator: validatePw, trigger: 'blur' }
          ],
          pass: [
            { required: true, message: '请输入登录密码', trigger: 'blur' },
            { min: 6, max: 24, message: '密码由6-24个字符组成，区分大小写', trigger: 'blur' }
          vc: [
            { required: true, message: '请输入验证码' }
          ]
        }
      };
@@ -57,51 +98,57 @@
    components: {
      Captcha
    },
    mounted() {
      this.$refs.obj.capShow();
    },
    methods: {
      touchSetin() {
        this.setInt(60)
      },
      setInt(num) {
        this.isDisabled = true;
        let timer = setInterval(() => {
          this.buttonMsg = `重新获取(${num--}秒)`
          if (num === 0) {
            this.isDisabled = false;
            this.buttonMsg = '获取短信验证码';
            clearInterval(timer);
          }
        }, 1000);
      },
      buttonCheck() {
        this.$refs.ruleForm.validateField('phone');
        if (this.phoneFlag) {
          this.$refs.obj.capShow();
        }
      },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.logining = true;
            let paramsData = {
              'email': this.ruleForm.mail,
              'pw': this.ruleForm.pass
            };
            this.$axios.post(httpUrl.hQuery.sign.login, paramsData).then(res => {
            this.ruleForm.companyId = this.$route.query.id;
            this.$axios.post('/ajax/sys/registe/comp', this.ruleForm, res => {
              this.logining = false;
              console.log(res);
              if (res.success) {
                this.$router.push({path: '/WorkHome'});
                this.$store.commit('SET_ACCOUNT', res.data.account);
                this.$store.commit('SET_USERID', res.data.id);
                this.$store.commit('SET_HEADPHOTO', res.data.head);
                this.$store.commit('SET_BINDCOMPANY', res.data.bindCompany);
                Cookies.set('userid', res.data.id);
                this.$router.push({path: '/home'});
              } else {
                let errorCode = [{
                  code: -600001,
                  msg: '用户不存在'
                }, {
                  code: -600002,
                  msg: '密码不正确'
                }, {
                  code: -600003,
                  msg: '平台信息不存在'
                }, {
                  code: -600004,
                  msg: '用户被禁用'
                }];
                for (let i = 0; i < errorCode.length; i++) {
                  if (res.code === errorCode[i].code) {
                    this.$message.error(errorCode[i].msg);
                    return;
                  };
                const errorCode = {
                  '-60001': '验证码已过期，请重新获取',
                  '-60002': '验证码错误，请重新输入',
                  '-60003': '该账号已存在，请重新输入'
                };
                this.$message.error(errorCode[res.code]);
              }
            }).catch(error => {
              console.log(error);
            });
            })
          } else {
            return false;
          }
        });
      },
      goBackPwd() {
        this.$router.push({path: '/findPwd'});
      }
    }
  };

src/views/logforms/findPwd.vue

@@ -13,19 +13,19 @@
        <div class="step-contain">
          <el-form v-show="stepFisrt" :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
            <el-form-item prop="mail">
              <el-input v-model="ruleForm.mail" placeholder="请输入手机号码"></el-input>
            <el-form-item prop="phone">
              <el-input v-model="ruleForm.phone" placeholder="请输入手机号码"></el-input>
            </el-form-item>
            <el-form-item prop="mail">
              <el-input v-model="ruleForm.mail" placeholder="请输入短信验证码" class='codeWidth'></el-input>
              <el-button type="primary" class='codeWidth codeButton'>获取短信验证码</el-button>
            <el-form-item prop="vc">
              <el-input v-model="ruleForm.vc" placeholder="请输入短信验证码" class='codeWidth'></el-input>
              <el-button type="primary" class='codeWidth codeButton' @click.stop="buttonCheck" :disabled="isDisabled">{{buttonMsg}}</el-button>
            </el-form-item>
            <el-form-item></el-form-item>
            <el-form-item class="textButton-box">
              <el-button type="primary" :disabled="isDisabl" @click="nextStep('ruleForm')">下一步</el-button>
            </el-form-item>
          </el-form>
          <el-form v-show="stepThird" :model="ruleForm2" :rules="rules2" ref="ruleForm2" class="demo-ruleForm">
          <el-form v-show="!stepFisrt" :model="ruleForm2" :rules="rules2" ref="ruleForm2" class="demo-ruleForm">
            <el-form-item prop="pass">
              <el-input type="password" v-model="ruleForm2.pass" placeholder="请设置您的新密码" auto-complete="off"></el-input>
            </el-form-item>
@@ -44,17 +44,37 @@
</template>
<script type="text/ecmascript-6">
  import Cookies from 'js-cookie';
  import httpUrl from '@/libs/http';
  import util from '@/libs/util';
  export default {
    data() {
      let validatePhone = (rule, value, callback) => {
        const pattern = /^1[34578]\d{9}$/;
        if (value === '') {
          this.phoneFlag = false;
          callback(new Error('请输入您的手机号码'));
        } else {
          if (!pattern.test(value)) {
            this.phoneFlag = false;
            callback(new Error('请输入正确的手机号码'));
          } else {
            let phone = this.ruleForm.phone;
            this.$axios.get('/ajax/sys/user/exists', { phone }, response => {
              if (response.success && response.data) {
                this.phoneFlag = true;
                callback();
              } else {
                this.phoneFlag = false;
                callback(new Error('该账号不存在，请重新输入'))
              }
            });
          }
        }
      };
      var validatePass = (rule, value, callback) => {
        const reg = /^[a-zA-Z0-9]{6,24}$/
        if (value === '') {
          callback(new Error('请设置您的新密码'));
        } else if (value.length < 6 || value.length > 24) {
         callback(new Error('密码由6-24个字符组成，区分大小写'));
        } else if (!reg.test(value)) {
          callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
        } else {
          if (this.ruleForm2.checkPass !== '') {
            this.$refs.ruleForm2.validateField('checkPass');
@@ -63,30 +83,32 @@
        }
      };
      var validatePass2 = (rule, value, callback) => {
        const reg = /^[a-zA-Z0-9]{6,24}$/
        if (value === '') {
          callback(new Error('请再次输入密码确认'));
        } else if (value !== this.ruleForm2.pass) {
          callback(new Error('两次输入密码不一致，请重新输入!'));
        } else if (!reg.test(value)) {
          callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
        } else {
          if (value !== this.ruleForm2.pass) {
            callback(new Error('两次输入密码不一致，请重新输入!'));
          }
          callback();
        }
      };
      return {
        platId: '',
        resetStepNum: '',
        resetCode: '',
        phoneFlag: false,
        isDisabled: false,
        buttonMsg: '获取短信验证码',
        stepVal: 0,
        stepFisrt: true,
        stepThird: false,
        isDisabl: false,
        ruleForm: {
          mail: ''
          phone: '',
          vc: ''
        },
        rules: {
          mail: [
            { required: true, message: '请输入邮箱账号', trigger: 'blur' },
            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur'] }
          ]
          phone: [{ required: true, validator: validatePhone, trigger: 'blur' }],
          vc: [{ required: true, message: '请输入验证码' }]
        },
        ruleForm2: {
          pass: '',
@@ -102,43 +124,44 @@
        }
      };
    },
    created() {
      this.platId = Cookies.get('platId');
      this.resetStepNum = util.urlParse('step');
      this.resetCode = util.urlParse('sc');
      if (this.resetStepNum === '2') {
        this.stepFisrt = false;
        this.stepThird = true;
        this.stepVal = 2;
      }
    },
    methods: {
      setInt(num = 60) {
        this.isDisabled = true;
        let timer = setInterval(() => {
          this.buttonMsg = `重新获取(${num--}秒)`
          if (num === 0) {
            this.isDisabled = false;
            this.buttonMsg = '获取短信验证码'
            clearInterval(timer);
          }
        }, 1000);
      },
      buttonCheck() {
        this.$refs.ruleForm.validateField('phone')
        if (this.phoneFlag) {
          let phone = this.ruleForm.phone;
          this.$axios.post('/ajax/sys/resetpw/phone/msg', {phone}, res => {
          })
          this.setInt();
        }
      },
      nextStep(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.$axios.post(httpUrl.hQuery.sign.reqResetPw, {
              id: this.platId,
              mail: this.ruleForm.mail,
              url: httpUrl.platUrl + '/#/findPwd?step=2&sc'
            }).then(res => {
            this.$axios.get('/ajax/sys/resetpw/phone/msgCheck', this.ruleForm, res => {
              console.log(res);
              if (res.success) {
                this.stepFisrt = false;
                this.stepVal = 1;
                if (res.data) {
                  this.stepFisrt = false;
                  this.stepVal = 1;
                } else {
                  this.$message.error('验验证码错误，请重新输入');
                }
              } else {
                let errorCode = [{
                  code: -600001,
                  msg: '用户不存在'
                }, {
                  code: -600002,
                  msg: '发送邮箱错误'
                }];
                for (let i = 0; i < errorCode.length; i++) {
                  if (res.code === errorCode[i].code) {
                    this.$message.error(errorCode[i].msg);
                    return;
                  };
                };
                let errorCode = {
                  '-60001': '验证码已过期，请重新获取'
                }
                this.$message.error(errorCode[res.code]);
              }
            });
          } else {
@@ -149,39 +172,22 @@
      resetPwd(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.$axios.post(httpUrl.hQuery.sign.resetpw, {
              code: this.resetCode,
              pw: this.ruleForm2.pass
            }).then(res => {
              console.log(res);
            this.ruleForm.pw = this.ruleForm2.pass;
            this.$axios.post('/ajax/sys/resetpw', this.ruleForm, res => {
              if (res.success) {
                this.$alert('您可以使用新密码登录您的账户了', '恭喜您，您的密码重置成功！', {
                this.$alert('您可以使用新密码登录您的账户了', '密码重置成功', {
                  confirmButtonText: '重新登录',
                  type: 'success',
                  center: true,
                  callback: action => {
                    if (action === 'confirm') {
                      this.$router.push({path: '/loginPlat'});
                      this.$store.dispatch('LogOut').then(() => {
                        this.$router.push({ path: '/loginPlat' });
                      });
                    };
                  }
                });
              } else {
                if (res.code === -600001) {
                  this.$alert('小提示：邮件内的链接有效时长为10分钟', '很抱歉，当前的链接已失效。', {
                    confirmButtonText: '重新找回密码',
                    type: 'warning',
                    center: true,
                    callback: action => {
                      if (action === 'confirm') {
                        this.stepFisrt = true;
                        this.stepThird = false;
                        this.stepVal = 0;
                      };
                    }
                  });
                  return;
                };
              };
              }
            });
          } else {
            return false;

src/views/logforms/inviteCodeLogin.vue

@@ -9,13 +9,12 @@
          <li class="table-panel-single tablePanelActive">邀请码登录</li>
        </ul>
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
          <el-form-item prop="mail">
            <el-input v-model="ruleForm.mail" placeholder="请输入邮箱地址"></el-input>
          <el-form-item prop="email">
            <el-input v-model="ruleForm.email" placeholder="请输入邮箱地址"></el-input>
          </el-form-item>
          <el-form-item prop="pass">
            <el-input type="password" v-model="ruleForm.pass" placeholder="请输入邀请码" auto-complete="off"></el-input>
          <el-form-item prop="inviteCode">
            <el-input type="password" v-model="ruleForm.inviteCode" placeholder="请输入邀请码" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item></el-form-item>
          <el-form-item>
            <el-button type="primary" :disabled="isDisabl" :loading="logining" @click="submitForm('ruleForm')">登录</el-button>
          </el-form-item>
@@ -26,24 +25,22 @@
</template>
<script type="text/ecmascript-6">
    import httpUrl from '@/libs/http';
    export default {
       data() {
        return {
          logining: false,
          isDisabl: false,
          ruleForm: {
            mail: '',
            pass: ''
            email: '',
            inviteCode: ''
          },
          rules: {
            mail: [
              { required: true, message: '请输入邮箱账号', trigger: 'blur' },
            email: [
              { required: true, message: '请输入您的邮箱地址', trigger: 'blur' },
              { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur'] }
            ],
            pass: [
              { required: true, message: '请输入登录密码', trigger: 'blur' },
              { min: 6, max: 24, message: '密码由6-24个字符组成，区分大小写', trigger: 'blur' }
            inviteCode: [
              { required: true, message: '请输入邀请码', trigger: 'blur' }
            ]
          }
        };
@@ -53,38 +50,22 @@
          this.$refs[formName].validate((valid) => {
            if (valid) {
              this.logining = true;
              let paramsData = {
                'email': this.ruleForm.mail,
                'pw': this.ruleForm.pass
              };
              this.$axios.post(httpUrl.hQuery.sign.login, paramsData).then(res => {
              this.$axios.post('/ajax/sys/inviteLogin', this.ruleForm, res => {
                this.logining = false;
                console.log(res);
                if (res.success) {
                  this.$router.push({path: '/WorkHome'});
                  if (res.data) {
                    this.$router.push({path: 'enterRegister', query: { id: res.data.id, orgName: res.data.name }});
                  } else {
                    this.$message.error('邮箱或邀请码错误，请重新输入');
                  }
                } else {
                  let errorCode = [{
                    code: -600001,
                    msg: '用户不存在'
                  }, {
                    code: -600002,
                    msg: '密码不正确'
                  }, {
                    code: -600003,
                    msg: '平台信息不存在'
                  }, {
                    code: -600004,
                    msg: '用户被禁用'
                  }];
                  for (let i = 0; i < errorCode.length; i++) {
                    if (res.code === errorCode[i].code) {
                      this.$message.error(errorCode[i].msg);
                      return;
                    };
                  };
                  const errorMsg = {
                    '-60001': '该账号已激活，请直接登录'
                  }
                  if (errorMsg[res.code]) {
                    this.$message.error(errorMsg[res.code]);
                  }
                }
              }).catch(error => {
                console.log(error);
              });
            } else {
              return false;

src/views/logforms/loginPlat.vue

@@ -28,9 +28,40 @@
</template>
<script type="text/ecmascript-6">
  import httpUrl from '@/libs/http';
  import Cookies from 'js-cookie';
  export default {
     data() {
      let validatePhone = (rule, value, callback) => {
        const pattern = /^1[34578]\d{9}$/;
        if (value === '') {
          callback(new Error('请输入您的手机号码'));
        } else {
          if (!pattern.test(value)) {
            callback(new Error('请输入正确的手机号码'));
          } else {
            let phone = this.ruleForm.phone;
            this.$axios.get('/ajax/sys/user/exists', { phone }, response => {
              if (response.success && response.data) {
                callback();
              } else {
                callback(new Error('该账号不存在，请先注册'))
              }
            });
          }
        }
      };
      let validatePw = (rule, value, callback) => {
        const reg = /^[a-zA-Z0-9]{6,24}$/
        if (value === '') {
          callback(new Error('请设置您的登录密码'));
        } else {
          if (!reg.test(value)) {
            callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
          } else {
            callback();
          }
        }
      }
      return {
        logining: false,
        isDisabl: false,
@@ -39,13 +70,11 @@
          pw: ''
        },
        rules: {
          mail: [
            { required: true, message: '请输入邮箱账号', trigger: 'blur' },
            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur'] }
          ],
          pass: [
            { required: true, message: '请输入登录密码', trigger: 'blur' },
            { min: 6, max: 24, message: '密码由6-24个字符组成，区分大小写', trigger: 'blur' }
          phone: [
          { required: true, validator: validatePhone, trigger: 'blur' }
        ],
          pw: [
            { required: true, validator: validatePw, trigger: 'blur' }
          ]
        }
      };
@@ -55,39 +84,29 @@
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.logining = true;
            let paramsData = {
              'email': this.ruleForm.mail,
              'pw': this.ruleForm.pass
            };
            this.$axios.post(httpUrl.hQuery.sign.login, paramsData).then(res => {
            this.$axios.post('/ajax/sys/login', this.ruleForm, res => {
              this.logining = false;
              console.log(res);
              if (res.success) {
                this.$router.push({path: '/WorkHome'});
                if (res.data == null) {
                  this.$message.error('登录账号与密码不匹配');
                } else {
                  this.$store.commit('SET_ACCOUNT', res.data.account);
                  this.$store.commit('SET_USERID', res.data.id);
                  this.$store.commit('SET_HEADPHOTO', res.data.head);
                  this.$store.commit('SET_BINDCOMPANY', res.data.bindCompany);
                  Cookies.set('userid', res.data.id);
                  this.$router.push({path: '/home'});
                  this.logining = true;
                }
              } else {
                let errorCode = [{
                  code: -600001,
                  msg: '用户不存在'
                }, {
                  code: -600002,
                  msg: '密码不正确'
                }, {
                  code: -600003,
                  msg: '平台信息不存在'
                }, {
                  code: -600004,
                  msg: '用户被禁用'
                }];
                for (let i = 0; i < errorCode.length; i++) {
                  if (res.code === errorCode[i].code) {
                    this.$message.error(errorCode[i].msg);
                    return;
                  };
                };
                let errorCode = {
                  '-60001': '该账号不存在，请先注册',
                  '-60002': '登录账号与密码不匹配',
                  '-60003': '该账号状态异常，请联系客服'
                }
                this.$message.error(errorCode[res.code]);
              }
            }).catch(error => {
              console.log(error);
            });
            })
          } else {
            return false;
          }

src/views/logforms/register.vue

@@ -8,16 +8,16 @@
          <el-form-item prop="phone">
            <el-input v-model="ruleForm.phone" placeholder="请输入手机号码"></el-input>
          </el-form-item>
          <el-form-item prop="pass">
            <el-input type="password" v-model="ruleForm.pass" placeholder="请输入登录密码" auto-complete="off"></el-input>
          <el-form-item prop="pw">
            <el-input type="password" v-model="ruleForm.pw" placeholder="请输入登录密码" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item prop="mail">
            <el-input v-model="ruleForm.mail" placeholder="请输入短信验证码" class='codeWidth'></el-input>
            <el-button type="primary" class='codeWidth codeButton'>获取短信验证码</el-button>
          <el-form-item prop="vc">
            <el-input v-model="ruleForm.vc" placeholder="请输入短信验证码" class='codeWidth'></el-input>
            <el-button type="primary" class='codeWidth codeButton' :disabled='isDisabled' @click="buttonCheck">{{buttonMsg}}</el-button>
          </el-form-item>
          <el-form-item>
            <i class="el-icon-check successSelect"></i><span class="protocol">我已阅读并同意<a href='#/userAgreement'>《邢台科技条件平台用户协议》</a></span>
          </el-form-item>
           <el-form-item>
             <i class="el-icon-check successSelect"></i><span class="protocol">我已阅读并同意<a href='#/loginPlat'>《邢台科技条件平台用户协议》</a></span>
           </el-form-item>
          <el-form-item>
            <el-button type="primary" :disabled="isDisabl" :loading="logining" @click="submitForm('ruleForm')">注册</el-button>
            <div class='existing-account'>已有账号<a href="#/loginPlat">立即登录</a></div>
@@ -25,34 +25,70 @@
        </el-form>
      </div>
    </div>
    <Captcha ref="obj"></Captcha>
    <Captcha ref="obj" :phone="ruleForm.phone" v-on:touchSetin="touchSetin"></Captcha>
  </div>
</template>
<script type="text/ecmascript-6">
  import httpUrl from '@/libs/http';
  import Cookies from 'js-cookie';
  import Captcha from './Captcha.vue';
  export default {
     data() {
      let validatePhone = (rule, value, callback) => {
        const pattern = /^1[34578]\d{9}$/;
        if (value === '') {
          this.phoneFlag = false;
          callback(new Error('请输入您的手机号码'));
        } else {
          if (!pattern.test(value)) {
            this.phoneFlag = false;
            callback(new Error('请输入正确的手机号码'));
          } else {
            let phone = this.ruleForm.phone;
            this.$axios.get('/ajax/sys/user/exists', { phone }, response => {
              if (response.success && response.data) {
                this.phoneFlag = false;
                callback(new Error('该账号已存在，请直接登录'))
              } else {
                this.phoneFlag = true;
                callback();
              }
            });
          }
        }
      };
      let validatePw = (rule, value, callback) => {
        const reg = /^[a-zA-Z0-9]{6,24}$/
        if (value === '') {
          callback(new Error('请设置您的登录密码'));
        } else {
          if (!reg.test(value)) {
            callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
          } else {
            callback();
          }
        }
      }
      return {
        isActive: true,
        ActiveNumber: 1,
        activeName: 'second',
        logining: false,
        isDisabl: false,
        isDisabled: false,
        buttonMsg: '获取短信验证码',
        phoneFlag: false,
        ruleForm: {
          mail: '',
          pass: ''
          phone: '',
          vc: '',
          pw: ''
        },
        rules: {
          mail: [
            { required: true, message: '请输入邮箱账号', trigger: 'blur' },
            { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur'] }
          phone: [
            { required: true, validator: validatePhone, trigger: 'blur' }
          ],
          pw: [
            { required: true, validator: validatePw, trigger: 'blur' }
          ],
          pass: [
            { required: true, message: '请输入登录密码', trigger: 'blur' },
            { min: 6, max: 24, message: '密码由6-24个字符组成，区分大小写', trigger: 'blur' }
          vc: [
            { required: true, message: '请输入验证码' }
          ]
        }
      };
@@ -60,56 +96,48 @@
    components: {
      Captcha
    },
    mounted() {
      this.$refs.obj.capShow();
    },
    methods: {
      panelSwitch(event) {
       if (event.target.className.includes('tablePanelActive')) {
         return;
       }
        this.isActive = !this.isActive;
      touchSetin() {
        this.setInt(60)
      },
      handleClick(tab, event) {
        console.log(tab, event);
      setInt(num) {
        this.isDisabled = true;
        let timer = setInterval(() => {
          this.buttonMsg = `重新获取(${num--}秒)`
          if (num === 0) {
            this.isDisabled = false;
            this.buttonMsg = '获取短信验证码'
            clearInterval(timer);
          }
        }, 1000);
      },
      buttonCheck() {
        this.$refs.ruleForm.validateField('phone')
        if (this.phoneFlag) {
          this.$refs.obj.capShow();
        }
      },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.logining = true;
            let paramsData = {
              'email': this.ruleForm.mail,
              'pw': this.ruleForm.pass
            };
            this.$axios.post(httpUrl.hQuery.sign.login, paramsData).then(res => {
            this.$axios.post('/ajax/sys/registe', this.ruleForm, res => {
              this.logining = false;
              console.log(res);
              if (res.success) {
                this.$router.push({path: '/WorkHome'});
                this.$store.commit('SET_ACCOUNT', res.data.account);
                this.$store.commit('SET_USERID', res.data.id);
                this.$store.commit('SET_HEADPHOTO', '');
                Cookies.set('userid', res.data.id)
                this.$router.push({path: '/home'});
              } else {
                let errorCode = [{
                  code: -600001,
                  msg: '用户不存在'
                }, {
                  code: -600002,
                  msg: '密码不正确'
                }, {
                  code: -600003,
                  msg: '平台信息不存在'
                }, {
                  code: -600004,
                  msg: '用户被禁用'
                }];
                for (let i = 0; i < errorCode.length; i++) {
                  if (res.code === errorCode[i].code) {
                    this.$message.error(errorCode[i].msg);
                    return;
                  };
                const errorCode = {
                  '-60001': '验证码已过期，请重新获取',
                  '-60002': '验证码错误，请重新输入',
                  '-60003': '该账号已存在，请直接登录'
                };
                this.$message.error(errorCode[res.code]);
              }
            }).catch(error => {
              console.log(error);
            });
            })
          } else {
            return false;
          }

src/views/personalCenter/common/index.vue

@@ -3,7 +3,7 @@
    <div class="boxLeft">
        <div class="headPhoto">
          <div class="userInfo">
            <img src="../../logforms/img/e-sign-on_bg_img_nor.png" alt="">
            <img :src="headPhoto" alt="">
            <p>专家姓名</p>
          </div>
        </div>
@@ -27,7 +27,7 @@
        <el-menu-item index="modifyDemand">修改需求</el-menu-item>
        <el-menu-item index="examineDemand">查看需求</el-menu-item>
      </el-submenu>
      <el-submenu index="2">
      <el-submenu index="2" v-if="bindCompany">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>我的企业</span>
@@ -55,11 +55,19 @@
</template>
<script>
  import { mapGetters } from 'vuex';
  export default {
    data() {
      return {
        img: ''
      };
    },
    computed: {
      ...mapGetters([
        'bindCompany',
        'headPhoto'
      ])
    },
    created() {
    },
    methods: {

src/views/personalCenter/modifyData.vue

@@ -6,139 +6,143 @@
    <div class='formHeadFormBox'>
      <div class='formBox'>
        <el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="80px" class="demo-ruleForm">
            <el-form-item label="用户名" prop="pass">
                <el-input v-model="ruleForm2.pass" autocomplete="off" placeholder="请输入用户名"></el-input>
          <el-col :span="12">
            <el-form-item label="用户名" prop="account">
              <el-input v-model="ruleForm2.account" autocomplete="off" placeholder="请输入用户名" maxlength="20"></el-input>
            </el-form-item>
            <el-form-item label="真实姓名" prop="checkPass">
                <el-input v-model="ruleForm2.checkPass" autocomplete="off" placeholder="请输入真实姓名"></el-input>
            <el-form-item label="真实姓名" prop="name">
              <el-input v-model="ruleForm2.name" autocomplete="off" placeholder="请输入真实姓名" maxlength="10"></el-input>
            </el-form-item>
            <el-form-item label="性别">
                <el-select v-model="ruleForm2.region" placeholder="请选择性别" style="width:100%">
                <el-option label="男" value="shanghai"></el-option>
                <el-option label="女" value="beijing"></el-option>
                </el-select>
            <el-form-item label="性别" prop="sex">
              <el-select v-model="ruleForm2.sex" placeholder="请选择性别" style="width: 100%">
                <el-option label="男" value="0"></el-option>
                <el-option label="女" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="职位" prop="age">
                <el-input v-model.number="ruleForm2.age" placeholder="请输入职位"></el-input>
            <el-form-item label="职位" prop="job">
              <el-input v-model.number="ruleForm2.job" placeholder="请输入职位" maxlength="20"></el-input>
            </el-form-item>
            <el-form-item label="所在机构" prop="age">
                <el-input v-model.number="ruleForm2.age" placeholder="请输入所在机构"></el-input>
            <el-form-item label="所在机构" prop="comp">
              <el-input v-model.number="ruleForm2.comp" placeholder="请输入所在机构" maxlength="50"></el-input>
            </el-form-item>
            <el-form-item label="联系电话" prop="age">
                <el-input v-model.number="ruleForm2.age" placeholder="请输入联系电话"></el-input>
            <el-form-item label="联系电话" prop="linkPhone">
              <el-input v-model.number="ruleForm2.linkPhone" placeholder="请输入联系电话" maxlength="50"></el-input>
            </el-form-item>
            <el-form-item label="联系邮箱" prop="age">
                <el-input v-model.number="ruleForm2.age" placeholder="请输入联系邮箱"></el-input>
            <el-form-item label="联系邮箱" prop="email">
              <el-input v-model="ruleForm2.email" placeholder="请输入联系邮箱" maxlength="100"></el-input>
            </el-form-item>
            <CityPick ref="cityPick"  :widthselect="206" :prov="ruleForm2.province" :city="ruleForm2.city" v-on:selectProv="getSelectProv($event)" v-on:selectCity="getSelectCity($event)"></CityPick>
            <el-form-item style="text-align:right">
                <el-button type="primary" @click="submitForm('ruleForm2')">保存修改</el-button>
            <CityPick ref="cityPick" :widthselect="180" :prov="province" :city="city"
              v-on:selectProv="getSelectProv($event)">
            </CityPick>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="head">
              <uploadFile :uploadImg='uploadImg' v-on:uploadfun="uploadfun" :upImgsStr="upImgsStr"></uploadFile>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item style="text-align: center;margin:15px 0">
              <el-button type="primary" @click="submitForm('ruleForm2')">保存修改</el-button>
            </el-form-item>
          </el-col>
        </el-form>
      </div>
      <div class="headPhotoBox">
        <el-upload
        class="avatar-uploader"
        action="https://jsonplaceholder.typicode.com/posts/"
        :show-file-list="false"
        :on-success="handleAvatarSuccess"
        :before-upload="beforeAvatarUpload">
        <img v-if="imageUrl" :src="imageUrl" class="avatar">
        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
      </el-upload>
      <p>上传头像</p>
      </div>
    </div>
  </div>
</template>
<script>
  import uploadFile from '@/components/uploadFile/index';
  import Cookies from 'js-cookie'
  export default {
    data() {
      var checkAge = (rule, value, callback) => {
        if (!value) {
          return callback(new Error('年龄不能为空'));
        }
        setTimeout(() => {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
          } else {
            if (value < 18) {
              callback(new Error('必须年满18岁'));
            } else {
              callback();
            }
          }
        }, 1000);
      };
      var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'));
        } else {
          if (this.ruleForm2.checkPass !== '') {
            this.$refs.ruleForm2.validateField('checkPass');
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.ruleForm2.pass) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      };
      return {
        imageUrl: '',
        province: '',
        city: '',
        upImgsStr: '',
        uploadImg: {
          url: '/ajax/product/logo',
          width: '200px',
          height: '200px',
          tip: '上传头像'
        },
        ruleForm2: {
          pass: '',
          checkPass: '',
          age: '',
          region: '',
          province: '',
          city: ''
          account: '',
          name: '',
          sex: '',
          job: '',
          comp: '',
          linkPhone: '',
          email: '',
          addr: '',
          head: ''
        },
        rules2: {
          pass: [
            { validator: validatePass, trigger: 'blur' }
          account: [
            { message: '请输入用户名', trigger: 'blur', required: true }
          ],
          checkPass: [
            { validator: validatePass2, trigger: 'blur' }
          ],
          age: [
            { validator: checkAge, trigger: 'blur' }
          email: [
            { type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }
          ]
        }
      };
    },
    components: {
      uploadFile
    },
    created() {
      let id = Cookies.get('userid');
      this.$axios.get('/ajax/sys/user/get', {id}, res => { // 拉取user_info
        if (res.success && res.data) {
          const response = res.data;
          this.ruleForm2 = {
            account: response.account,
            name: response.name,
            sex: response.sex,
            job: response.job,
            comp: response.comp,
            linkPhone: response.linkPhone,
            email: response.email,
            addr: response.addr,
            head: response.head
          };
          this.upImgsStr = response.head;
          this.province = `${response.addr.substr(0, 2)}0000`;
          this.city = response.addr;
        } else {
          this.$store.dispatch('FedLogOut').then(res => {
            this.$message.error('登录状态失效，请重新登录');
            this.$router.push({ path: '/loginPlat' });
          })
        }
      })
    },
    methods: {
     handleAvatarSuccess(res, file) {
        this.imageUrl = URL.createObjectURL(file.raw);
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 2;
        // if (!isJPG) {
        //   this.$message.error('上传头像图片只能是 JPG 格式!');
        // }
        // if (!isLt2M) {
        //   this.$message.error('上传头像图片大小不能超过 2MB!');
        // }
        return isJPG && isLt2M;
      uploadfun(value) {
        this.ruleForm2.head = value
      },
      getSelectProv(prov) {
        this.ruleForm2.province = prov;
      },
      getSelectCity(city) {
        this.ruleForm2.city = city;
        this.ruleForm2.addr = prov;
      },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert('submit!');
            this.$axios.post('/ajax/sys/user', this.ruleForm2, res => {
              console.log(res)
              if (res.success) {
                this.$store.commit('SET_ACCOUNT', this.ruleForm2.account);
                this.$store.commit('SET_HEADPHOTO', this.ruleForm2.head);
                this.$message({
                  message: '资料修改成功',
                  type: 'success'
                });
              } else {
                this.$store.dispatch('FedLogOut').then(res => {
                  this.$message.error('登录状态失效，请重新登录');
                  this.$router.push({ path: '/loginPlat' });
                })
              }
            })
          } else {
            console.log('error submit!!');
            return false;
@@ -151,47 +155,3 @@
    }
  };
</script>
<style>
    .formHeadFormBox {
      margin-left: 20px;
      position: relative;
    }
    .formBox {
      width: 500px;
    }
    .headPhotoBox {
      position: absolute;
      right: 90px;
      top: 0px;
    }
    .headPhotoBox p {
        text-align: center;
        line-height: 30px;
        color: #606266;
        font-size: 14px
    }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>

src/views/personalCenter/modifyPassword.vue

@@ -4,21 +4,21 @@
      <el-tab-pane label="修改密码"></el-tab-pane>
    </el-tabs>
    <div class="formBoxCenter">
         <a href="#/findPwd">忘记密码？</a>
        <div class="boxCenter">
          <el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="100px" class="demo-ruleForm">
            <el-form-item label="原密码" prop="pass">
                <el-input type="password" v-model="ruleForm2.pass" autocomplete="off" placeholder="请输入原密码"></el-input>
            </el-form-item>
            <el-form-item label="新密码" prop="checkPass">
                <el-input type="password" v-model="ruleForm2.checkPass" autocomplete="off" placeholder="请输入新密码"></el-input>
            </el-form-item>
            <el-form-item label="再次输入" prop="age">
                <el-input v-model.number="ruleForm2.age"></el-input>
            </el-form-item>
            <el-form-item style="text-align:center">
                <el-button type="primary" @click="submitForm('ruleForm2')">保存修改</el-button>
            </el-form-item>
      <a href="#/findPwd">忘记密码？</a>
      <div class="boxCenter">
        <el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="100px" class="demo-ruleForm">
          <el-form-item label="原密码" prop="opw">
            <el-input type="password" v-model="ruleForm2.opw" autocomplete="off" placeholder="请输入原密码"></el-input>
          </el-form-item>
          <el-form-item label="新密码" prop="npw">
            <el-input type="password" v-model="ruleForm2.npw" autocomplete="off" placeholder="请输入新密码"></el-input>
          </el-form-item>
          <el-form-item label="再次输入" prop="npwCheck">
            <el-input type="password" v-model="ruleForm2.npwCheck" placeholder="请确认新密码"></el-input>
          </el-form-item>
          <el-form-item style="text-align:center">
            <el-button type="primary" @click="submitForm('ruleForm2')">保存修改</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
@@ -27,56 +27,60 @@
<script>
  export default {
    data() {
      var checkAge = (rule, value, callback) => {
        if (!value) {
          return callback(new Error('年龄不能为空'));
        }
        setTimeout(() => {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
      const reg = /^[a-zA-Z0-9]{6,24}$/;
      var checkOpw = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入原密码'));
        } else {
          if (!reg.test(value)) {
            callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
          } else {
            if (value < 18) {
              callback(new Error('必须年满18岁'));
            } else {
              callback();
            }
            callback();
          }
        }, 1000);
        }
      };
      var validatePass = (rule, value, callback) => {
      var validateNpw = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'));
          callback(new Error('请设置您的新密码'));
        } else {
          if (this.ruleForm2.checkPass !== '') {
            this.$refs.ruleForm2.validateField('checkPass');
          if (!reg.test(value)) {
            callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
          } else {
            if (this.ruleForm2.npwCheck !== '') {
              this.$refs.ruleForm2.validateField('npwCheck');
            }
            callback();
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
      var validateNpwCheck = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.ruleForm2.pass) {
          callback(new Error('两次输入密码不一致!'));
          callback(new Error('请再次输入密码确认'));
        } else if (!reg.test(value)) {
          callback(new Error('密码由6-24个数字和字母组成，区分大小写'));
        } else {
          callback();
          if (value !== this.ruleForm2.npw) {
            callback(new Error('两次输入不一致，请重新输入!'));
          } else {
            callback();
          }
        }
      };
      return {
        ruleForm2: {
          pass: '',
          checkPass: '',
          age: ''
          opw: '',
          npw: '',
          npwCheck: ''
        },
        rules2: {
          pass: [
            { validator: validatePass, trigger: 'blur' }
          npw: [
            { validator: validateNpw, trigger: 'blur', required: true }
          ],
          checkPass: [
            { validator: validatePass2, trigger: 'blur' }
          npwCheck: [
            { validator: validateNpwCheck, trigger: 'blur', required: true }
          ],
          age: [
            { validator: checkAge, trigger: 'blur' }
          opw: [
            { validator: checkOpw, trigger: 'blur', required: true }
          ]
        }
      };
@@ -85,9 +89,21 @@
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert('submit!');
            this.$axios.post('/ajax/sys/user/changepasswd', this.ruleForm2, res => {
              if (res.success) {
                if (res.data) {
                  this.$message({
                    message: '密码修改成功',
                    type: 'success'
                  });
                } else if (res.data === 0) {
                  this.$message.error('旧密码输入错误，请重新输入');
                } else {
                  this.$message.error('登录账号与密码不匹配');
                }
              }
            });
          } else {
            console.log('error submit!!');
            return false;
          }
        });
@@ -99,17 +115,20 @@
  };
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
  .formBoxCenter
    display:flex
    align-items: center
    justify-content: center
    .boxCenter
      width: 450px
      position: relative
    a
      position: absolute
      top: 60px
      right: 140px
      color: #409EFF
<style lang="scss" rel="stylesheet/scss" scoped>
  .formBoxCenter {
    display: flex;
    align-items: center;
    justify-content: center;
    .boxCenter {
      width: 450px;
      position: relative;
    }
    a {
      position: absolute;
      top: 60px;
      right: 140px;
      color: $mainColor;
    }
  }
</style>