|
|
@@ -1,220 +1,435 @@
|
|
|
<template>
|
|
|
<div class="setting personal-setting" v-loading="loading" v-if="personalInfo">
|
|
|
<template v-if="!settingFlag">
|
|
|
- <div class="setting-top">
|
|
|
- <div class="avator-box">
|
|
|
- <el-image
|
|
|
- :src="personalInfo.image_url?personalInfo.image_url:require('../../../assets/avatar.png')"
|
|
|
- fit="cover" style="width:96px;height:96px;">
|
|
|
- </el-image>
|
|
|
- <a class="img-crop">
|
|
|
- <upload :datafileList="infoForm.cover_image_list" :filleNumber="99" :changeFillId="handleAvatarSuccess" :fileName="'cover'" :showList="true" uploadType="image" />
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- <div class="center">
|
|
|
- <div class="info-items">
|
|
|
- <label>用户名：</label>
|
|
|
- <span>{{personalInfo.user_name}}</span>
|
|
|
- </div>
|
|
|
- <div class="info-items">
|
|
|
- <label>手机号码：</label>
|
|
|
- <span>{{personalInfo.phone?personalInfo.phone.substring(0,3)+'******'+personalInfo.phone.substring(9,11):'-'}}</span>
|
|
|
- </div>
|
|
|
- <div class="info-items">
|
|
|
- <label>账号ID：</label>
|
|
|
- <span>{{personalInfo.id}}</span>
|
|
|
- </div>
|
|
|
- <div class="info-items">
|
|
|
- <label>邮箱：</label>
|
|
|
- <span>{{personalInfo.email?personalInfo.email:'-'}}</span>
|
|
|
- </div>
|
|
|
- <div class="info-items">
|
|
|
- <label>注册时间：</label>
|
|
|
- <span>{{personalInfo.register_time}}</span>
|
|
|
- </div>
|
|
|
- <div class="info-items">
|
|
|
- <label>机构：</label>
|
|
|
- <span>{{personalInfo.org_name}}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="setting-top">
|
|
|
+ <div class="avator-box">
|
|
|
+ <el-image
|
|
|
+ :src="
|
|
|
+ personalInfo.image_url
|
|
|
+ ? personalInfo.image_url
|
|
|
+ : require('../../../assets/avatar.png')
|
|
|
+ "
|
|
|
+ fit="cover"
|
|
|
+ style="width: 96px; height: 96px"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ <a class="img-crop">
|
|
|
+ <upload
|
|
|
+ :datafileList="infoForm.cover_image_list"
|
|
|
+ :filleNumber="99"
|
|
|
+ :changeFillId="handleAvatarSuccess"
|
|
|
+ :fileName="'cover'"
|
|
|
+ :showList="true"
|
|
|
+ uploadType="image"
|
|
|
+ />
|
|
|
+ </a>
|
|
|
</div>
|
|
|
- <div class="setting-bottom">
|
|
|
- <div class="tabs-box">
|
|
|
- <a :class="[tabsIndex===0?'active':'']" @click="handleChangeTabs(0)">基本信息</a>
|
|
|
- <a :class="[tabsIndex===1?'active':'']" @click="handleChangeTabs(1)">安全设置</a>
|
|
|
- </div>
|
|
|
- <template v-if="tabsIndex===0">
|
|
|
- <el-form :model="infoForm" :rules="rules" ref="ruleForm" label-width="150px" class="setting-form">
|
|
|
- <el-form-item label="用户名" prop="name">
|
|
|
- <el-input v-model="infoForm.name" disabled placeholder="请输入用户名" maxlength="20"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="真实姓名" prop="realName">
|
|
|
- <el-input v-model="infoForm.realName" placeholder="请输入真实姓名" maxlength="20" @blur="handleTrim('infoForm','realName')"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="性别" prop="sex">
|
|
|
- <el-radio-group v-model="infoForm.sex">
|
|
|
- <el-radio :label="1">男</el-radio>
|
|
|
- <el-radio :label="0">女</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="所在省市" prop="selectedOptions">
|
|
|
- <el-cascader
|
|
|
- size="medium"
|
|
|
- :options="$provinceCityList"
|
|
|
- v-model="infoForm.selectedOptions"
|
|
|
- @change="handleCity">
|
|
|
- </el-cascader>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="备注" prop="desc">
|
|
|
- <el-input type="textarea" v-model="infoForm.desc" placeholder="请输入备注" maxlength="100" :rows="4" show-word-limit @blur="handleTrim('infoForm','desc')"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="我的机构" prop="region">
|
|
|
- <el-select v-model="infoForm.region" placeholder="请选择机构" :disabled="personalInfo.is_manager==='true'">
|
|
|
- <el-option
|
|
|
- v-for="item in orgList"
|
|
|
- :key="item.id"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <!-- -->
|
|
|
- <el-tag class="audit-status" v-if="personalInfo.audit_status===0">
|
|
|
- <svg-icon icon-class="information-fill"></svg-icon>审核中
|
|
|
- </el-tag>
|
|
|
- <el-tag class="audit-status audit-refused" v-if="personalInfo.audit_status===2">
|
|
|
- <i class="el-icon-error"></i>已拒绝
|
|
|
- </el-tag>
|
|
|
- <!-- <el-button v-if="regionFlag" type="primary" size="small" class="btn" @click="regionFlag=!regionFlag">申请变更</el-button>
|
|
|
- <template v-else>
|
|
|
- <el-button type="primary" @click="handleChangeOrg" size="small" class="btn">提交</el-button>
|
|
|
- <el-button @click="handleorgCancel" size="small">取消</el-button>
|
|
|
- </template> -->
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmit('ruleForm')" size="small" :loading="submitLoading">保存</el-button>
|
|
|
- <el-button @click="onCancel('ruleForm')" size="small">取消</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </template>
|
|
|
- <template v-if="tabsIndex===1">
|
|
|
- <div class="safe-items">
|
|
|
- <label>登录密码</label>
|
|
|
- <div class="safe-items-right">
|
|
|
- <p class="hasContent">
|
|
|
- 已设置。密码至少6位字符，支持数字和字母，且必须同时包含数字和大小写字母。
|
|
|
- </p>
|
|
|
- <a @click="handleSetting('passwordFlag')">{{personalInfo.password?'修改':'设置'}}</a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="safe-items">
|
|
|
- <label>绑定手机</label>
|
|
|
- <div class="safe-items-right">
|
|
|
- <p v-if="personalInfo.phone" class="hasContent">
|
|
|
- 已绑定： {{personalInfo.phone.substring(0,3)+'******'+personalInfo.phone.substring(9,11)}}
|
|
|
- </p>
|
|
|
- <p v-else class="noContent">
|
|
|
- 您暂未绑定手机，绑定手机可以有效的保护账号的安全。
|
|
|
- </p>
|
|
|
- <a @click="handleSetting('phoneFlag')">{{personalInfo.phone?'修改':'设置'}}</a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="safe-items">
|
|
|
- <label>绑定邮箱</label>
|
|
|
- <div class="safe-items-right">
|
|
|
- <p v-if="personalInfo.email" class="hasContent">
|
|
|
- 已绑定： {{personalInfo.email}}
|
|
|
- </p>
|
|
|
- <p v-else class="noContent">
|
|
|
- 您暂未设置邮箱，绑定邮箱可以用来找回密码、接收通知等。
|
|
|
- </p>
|
|
|
- <a @click="handleSetting('emailFlag')">{{personalInfo.email?'修改':'设置'}}</a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <div class="center">
|
|
|
+ <div class="info-items">
|
|
|
+ <label>用户名：</label>
|
|
|
+ <span>{{ personalInfo.user_name }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-items">
|
|
|
+ <label>手机号码：</label>
|
|
|
+ <span>{{
|
|
|
+ personalInfo.phone
|
|
|
+ ? personalInfo.phone.substring(0, 3) +
|
|
|
+ "******" +
|
|
|
+ personalInfo.phone.substring(9, 11)
|
|
|
+ : "-"
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-items">
|
|
|
+ <label>账号ID：</label>
|
|
|
+ <span>{{ personalInfo.id }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-items">
|
|
|
+ <label>邮箱：</label>
|
|
|
+ <span>{{ personalInfo.email ? personalInfo.email : "-" }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-items">
|
|
|
+ <label>注册时间：</label>
|
|
|
+ <span>{{ personalInfo.register_time }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-items">
|
|
|
+ <label>机构：</label>
|
|
|
+ <span>{{ personalInfo.org_name }}</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </template>
|
|
|
- <div class="setting-iframe" v-if="settingFlag&&passwordFlag">
|
|
|
- <p class="title">
|
|
|
- <i class="el-icon-arrow-left" @click="handleSetting('passwordFlag')"></i>
|
|
|
- 登录密码
|
|
|
- </p>
|
|
|
- <el-form :model="passwordForm" :rules="rulesPassword" ref="passwordForm" label-width="100px" class="passwordForm">
|
|
|
- <el-form-item label="原始密码" prop="oldPwd">
|
|
|
- <el-input v-model="passwordForm.oldPwd" :type="oldPwdFlag?'text':'password'" autocomplete="off" placeholder="请输入密码" maxlength="20" @blur="handleTrim('passwordForm','oldPwd')">
|
|
|
- <i slot="suffix" class="el-icon-view show-icon" @click="changeIcon('oldPwdFlag')" v-if="oldPwdFlag"></i>
|
|
|
- <i slot="suffix" class="show-icon" @click="changeIcon('oldPwdFlag')" v-else>
|
|
|
- <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
- </i>
|
|
|
- </el-input>
|
|
|
+ </div>
|
|
|
+ <div class="setting-bottom">
|
|
|
+ <div class="tabs-box">
|
|
|
+ <a
|
|
|
+ :class="[tabsIndex === 0 ? 'active' : '']"
|
|
|
+ @click="handleChangeTabs(0)"
|
|
|
+ >基本信息</a
|
|
|
+ >
|
|
|
+ <a
|
|
|
+ :class="[tabsIndex === 1 ? 'active' : '']"
|
|
|
+ @click="handleChangeTabs(1)"
|
|
|
+ >安全设置</a
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <template v-if="tabsIndex === 0">
|
|
|
+ <el-form
|
|
|
+ :model="infoForm"
|
|
|
+ :rules="rules"
|
|
|
+ ref="ruleForm"
|
|
|
+ label-width="150px"
|
|
|
+ class="setting-form"
|
|
|
+ >
|
|
|
+ <el-form-item label="用户名" prop="name">
|
|
|
+ <el-input
|
|
|
+ v-model="infoForm.name"
|
|
|
+ placeholder="请输入用户名"
|
|
|
+ maxlength="20"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="修改密码" prop="newPwd">
|
|
|
- <el-input v-model="passwordForm.newPwd" :type="newPwdFlag?'text':'password'" autocomplete="off" placeholder="请输入密码" maxlength="20" @blur="handleTrim('passwordForm','newPwd')">
|
|
|
- <i slot="suffix" class="el-icon-view show-icon" @click="changeIcon('newPwdFlag')" v-if="newPwdFlag"></i>
|
|
|
- <i slot="suffix" class="show-icon" @click="changeIcon('newPwdFlag')" v-else>
|
|
|
- <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
- </i>
|
|
|
- </el-input>
|
|
|
+ <el-form-item label="真实姓名" prop="realName">
|
|
|
+ <el-input
|
|
|
+ v-model="infoForm.realName"
|
|
|
+ placeholder="请输入真实姓名"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('infoForm', 'realName')"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="再次输入" prop="confirmPwd">
|
|
|
- <el-input v-model="passwordForm.confirmPwd" :type="comfirmPwdFlag?'text':'password'" autocomplete="off" placeholder="请输入密码" maxlength="20" @blur="handleTrim('passwordForm','confirmPwd')">
|
|
|
- <i slot="suffix" class="el-icon-view show-icon" @click="changeIcon('comfirmPwdFlag')" v-if="comfirmPwdFlag"></i>
|
|
|
- <i slot="suffix" class="show-icon" @click="changeIcon('comfirmPwdFlag')" v-else>
|
|
|
- <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
- </i>
|
|
|
- </el-input>
|
|
|
+ <el-form-item label="性别" prop="sex">
|
|
|
+ <el-radio-group v-model="infoForm.sex">
|
|
|
+ <el-radio :label="1">男</el-radio>
|
|
|
+ <el-radio :label="0">女</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
</el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmitPassword('passwordForm')" size="small" :loading="passwordLoading">保存</el-button>
|
|
|
- <el-button @click="onCancel('passwordForm')" size="small">取消</el-button>
|
|
|
+ <el-form-item label="所在省市" prop="selectedOptions">
|
|
|
+ <el-cascader
|
|
|
+ size="medium"
|
|
|
+ :options="$provinceCityList"
|
|
|
+ v-model="infoForm.selectedOptions"
|
|
|
+ @change="handleCity"
|
|
|
+ >
|
|
|
+ </el-cascader>
|
|
|
</el-form-item>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <div class="setting-iframe" v-if="settingFlag&&phoneFlag">
|
|
|
- <p class="title">
|
|
|
- <i class="el-icon-arrow-left" @click="handleSetting('phoneFlag')"></i>
|
|
|
- 绑定手机
|
|
|
- </p>
|
|
|
- <el-form :model="phoneForm" :rules="rulesPhone" ref="phoneForm" label-width="100px" class="phoneForm">
|
|
|
- <el-form-item label="新手机号" prop="newPhone">
|
|
|
- <el-input v-model="phoneForm.newPhone" autocomplete="off" placeholder="请输入完整手机号" maxlength="20" @blur="handleTrim('phoneForm','newPhone')">
|
|
|
- <template slot="prepend">+86</template>
|
|
|
- </el-input>
|
|
|
+ <el-form-item label="备注" prop="desc">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ v-model="infoForm.desc"
|
|
|
+ placeholder="请输入备注"
|
|
|
+ maxlength="100"
|
|
|
+ :rows="4"
|
|
|
+ show-word-limit
|
|
|
+ @blur="handleTrim('infoForm', 'desc')"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="验证码" prop="newCode" class="code-box">
|
|
|
- <el-input v-model="phoneForm.newCode" autocomplete="off" placeholder="请输入验证码" class="code-input" maxlength="20" @blur="handleTrim('phoneForm','newCode')">
|
|
|
- </el-input>
|
|
|
- <el-button type="primary" @click="sendCode('times','newPhone','verificationCodesShow')" size="small" class="sendCode">
|
|
|
- {{ verificationCodesShow ? times+'s' : '发送验证码' }}
|
|
|
- </el-button>
|
|
|
+ <el-form-item label="我的机构" prop="region">
|
|
|
+ <el-select
|
|
|
+ v-model="infoForm.region"
|
|
|
+ placeholder="请选择机构"
|
|
|
+ :disabled="personalInfo.is_manager === 'true'"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in orgList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- -->
|
|
|
+ <el-tag
|
|
|
+ class="audit-status"
|
|
|
+ v-if="personalInfo.audit_status === 0"
|
|
|
+ >
|
|
|
+ <svg-icon icon-class="information-fill"></svg-icon>审核中
|
|
|
+ </el-tag>
|
|
|
+ <el-tag
|
|
|
+ class="audit-status audit-refused"
|
|
|
+ v-if="personalInfo.audit_status === 2"
|
|
|
+ >
|
|
|
+ <i class="el-icon-error"></i>已拒绝
|
|
|
+ </el-tag>
|
|
|
+ <!-- <el-button v-if="regionFlag" type="primary" size="small" class="btn" @click="regionFlag=!regionFlag">申请变更</el-button>
|
|
|
+ <template v-else>
|
|
|
+ <el-button type="primary" @click="handleChangeOrg" size="small" class="btn">提交</el-button>
|
|
|
+ <el-button @click="handleorgCancel" size="small">取消</el-button>
|
|
|
+ </template> -->
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmitPhone('phoneForm')" size="small" :loading="passwordLoading">保存</el-button>
|
|
|
- <el-button @click="onCancel('phoneForm')" size="small">取消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="onSubmit('ruleForm')"
|
|
|
+ size="small"
|
|
|
+ :loading="submitLoading"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onCancel('ruleForm')" size="small"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
</el-form-item>
|
|
|
- </el-form>
|
|
|
+ </el-form>
|
|
|
+ </template>
|
|
|
+ <template v-if="tabsIndex === 1">
|
|
|
+ <div class="safe-items">
|
|
|
+ <label>登录密码</label>
|
|
|
+ <div class="safe-items-right">
|
|
|
+ <p class="hasContent">
|
|
|
+ 已设置。密码至少6位字符，支持数字和字母，且必须同时包含数字和大小写字母。
|
|
|
+ </p>
|
|
|
+ <a @click="handleSetting('passwordFlag')">{{
|
|
|
+ personalInfo.password ? "修改" : "设置"
|
|
|
+ }}</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="safe-items">
|
|
|
+ <label>绑定手机</label>
|
|
|
+ <div class="safe-items-right">
|
|
|
+ <p v-if="personalInfo.phone" class="hasContent">
|
|
|
+ 已绑定：
|
|
|
+ {{
|
|
|
+ personalInfo.phone.substring(0, 3) +
|
|
|
+ "******" +
|
|
|
+ personalInfo.phone.substring(9, 11)
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ <p v-else class="noContent">
|
|
|
+ 您暂未绑定手机，绑定手机可以有效的保护账号的安全。
|
|
|
+ </p>
|
|
|
+ <a @click="handleSetting('phoneFlag')">{{
|
|
|
+ personalInfo.phone ? "修改" : "设置"
|
|
|
+ }}</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="safe-items">
|
|
|
+ <label>绑定邮箱</label>
|
|
|
+ <div class="safe-items-right">
|
|
|
+ <p v-if="personalInfo.email" class="hasContent">
|
|
|
+ 已绑定： {{ personalInfo.email }}
|
|
|
+ </p>
|
|
|
+ <p v-else class="noContent">
|
|
|
+ 您暂未设置邮箱，绑定邮箱可以用来找回密码、接收通知等。
|
|
|
+ </p>
|
|
|
+ <a @click="handleSetting('emailFlag')">{{
|
|
|
+ personalInfo.email ? "修改" : "设置"
|
|
|
+ }}</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="setting-iframe" v-if="settingFlag && passwordFlag">
|
|
|
+ <p class="title">
|
|
|
+ <i
|
|
|
+ class="el-icon-arrow-left"
|
|
|
+ @click="handleSetting('passwordFlag')"
|
|
|
+ ></i>
|
|
|
+ 登录密码
|
|
|
+ </p>
|
|
|
+ <el-form
|
|
|
+ :model="passwordForm"
|
|
|
+ :rules="rulesPassword"
|
|
|
+ ref="passwordForm"
|
|
|
+ label-width="100px"
|
|
|
+ class="passwordForm"
|
|
|
+ >
|
|
|
+ <el-form-item label="原始密码" prop="oldPwd">
|
|
|
+ <el-input
|
|
|
+ v-model="passwordForm.oldPwd"
|
|
|
+ :type="oldPwdFlag ? 'text' : 'password'"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('passwordForm', 'oldPwd')"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="el-icon-view show-icon"
|
|
|
+ @click="changeIcon('oldPwdFlag')"
|
|
|
+ v-if="oldPwdFlag"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="show-icon"
|
|
|
+ @click="changeIcon('oldPwdFlag')"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
+ </i>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="修改密码" prop="newPwd">
|
|
|
+ <el-input
|
|
|
+ v-model="passwordForm.newPwd"
|
|
|
+ :type="newPwdFlag ? 'text' : 'password'"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('passwordForm', 'newPwd')"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="el-icon-view show-icon"
|
|
|
+ @click="changeIcon('newPwdFlag')"
|
|
|
+ v-if="newPwdFlag"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="show-icon"
|
|
|
+ @click="changeIcon('newPwdFlag')"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
+ </i>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="再次输入" prop="confirmPwd">
|
|
|
+ <el-input
|
|
|
+ v-model="passwordForm.confirmPwd"
|
|
|
+ :type="comfirmPwdFlag ? 'text' : 'password'"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('passwordForm', 'confirmPwd')"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="el-icon-view show-icon"
|
|
|
+ @click="changeIcon('comfirmPwdFlag')"
|
|
|
+ v-if="comfirmPwdFlag"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="show-icon"
|
|
|
+ @click="changeIcon('comfirmPwdFlag')"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <svg-icon icon-class="eye-invisible"></svg-icon>
|
|
|
+ </i>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="onSubmitPassword('passwordForm')"
|
|
|
+ size="small"
|
|
|
+ :loading="passwordLoading"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onCancel('passwordForm')" size="small"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
- <div class="setting-iframe" v-if="settingFlag&&emailFlag">
|
|
|
- <p class="title">
|
|
|
- <i class="el-icon-arrow-left" @click="handleSetting('emailFlag')"></i>
|
|
|
- 绑定邮箱
|
|
|
- </p>
|
|
|
- <el-form :model="emailForm" :rules="rulesEmail" ref="emailForm" label-width="100px" class="emailForm">
|
|
|
- <el-form-item label="绑定邮箱" prop="email">
|
|
|
- <el-input v-model="emailForm.email" autocomplete="off" placeholder="请输入邮箱地址" maxlength="100" @blur="handleTrim('emailForm','email')">
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="验证码" prop="code" class="code-box">
|
|
|
- <el-input v-model="emailForm.code" autocomplete="off" placeholder="请输入验证码" class="code-input" maxlength="20" @blur="handleTrim('emailForm','code')">
|
|
|
- </el-input>
|
|
|
- <el-button type="primary" @click="sendCode('timee','email','verificationCodeeShow','email')" size="small" class="sendCode">
|
|
|
- {{ verificationCodeeShow ? timee+'s' : '发送验证码' }}
|
|
|
- </el-button>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmitEmail('emailForm')" size="small" :loading="passwordLoading">保存</el-button>
|
|
|
- <el-button @click="onCancel('emailForm')" size="small">取消</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
+ <div class="setting-iframe" v-if="settingFlag && phoneFlag">
|
|
|
+ <p class="title">
|
|
|
+ <i class="el-icon-arrow-left" @click="handleSetting('phoneFlag')"></i>
|
|
|
+ 绑定手机
|
|
|
+ </p>
|
|
|
+ <el-form
|
|
|
+ :model="phoneForm"
|
|
|
+ :rules="rulesPhone"
|
|
|
+ ref="phoneForm"
|
|
|
+ label-width="100px"
|
|
|
+ class="phoneForm"
|
|
|
+ >
|
|
|
+ <el-form-item label="新手机号" prop="newPhone">
|
|
|
+ <el-input
|
|
|
+ v-model="phoneForm.newPhone"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入完整手机号"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('phoneForm', 'newPhone')"
|
|
|
+ >
|
|
|
+ <template slot="prepend">+86</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="验证码" prop="newCode" class="code-box">
|
|
|
+ <el-input
|
|
|
+ v-model="phoneForm.newCode"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入验证码"
|
|
|
+ class="code-input"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('phoneForm', 'newCode')"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="sendCode('times', 'newPhone', 'verificationCodesShow')"
|
|
|
+ size="small"
|
|
|
+ class="sendCode"
|
|
|
+ >
|
|
|
+ {{ verificationCodesShow ? times + "s" : "发送验证码" }}
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="onSubmitPhone('phoneForm')"
|
|
|
+ size="small"
|
|
|
+ :loading="passwordLoading"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onCancel('phoneForm')" size="small"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="setting-iframe" v-if="settingFlag && emailFlag">
|
|
|
+ <p class="title">
|
|
|
+ <i class="el-icon-arrow-left" @click="handleSetting('emailFlag')"></i>
|
|
|
+ 绑定邮箱
|
|
|
+ </p>
|
|
|
+ <el-form
|
|
|
+ :model="emailForm"
|
|
|
+ :rules="rulesEmail"
|
|
|
+ ref="emailForm"
|
|
|
+ label-width="100px"
|
|
|
+ class="emailForm"
|
|
|
+ >
|
|
|
+ <el-form-item label="绑定邮箱" prop="email">
|
|
|
+ <el-input
|
|
|
+ v-model="emailForm.email"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入邮箱地址"
|
|
|
+ maxlength="100"
|
|
|
+ @blur="handleTrim('emailForm', 'email')"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="验证码" prop="code" class="code-box">
|
|
|
+ <el-input
|
|
|
+ v-model="emailForm.code"
|
|
|
+ autocomplete="off"
|
|
|
+ placeholder="请输入验证码"
|
|
|
+ class="code-input"
|
|
|
+ maxlength="20"
|
|
|
+ @blur="handleTrim('emailForm', 'code')"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="
|
|
|
+ sendCode('timee', 'email', 'verificationCodeeShow', 'email')
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ class="sendCode"
|
|
|
+ >
|
|
|
+ {{ verificationCodeeShow ? timee + "s" : "发送验证码" }}
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="onSubmitEmail('emailForm')"
|
|
|
+ size="small"
|
|
|
+ :loading="passwordLoading"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onCancel('emailForm')" size="small"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -222,9 +437,9 @@
|
|
|
<script>
|
|
|
//这里可以导入其它文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
|
|
//例如：import 《组件名称》from ‘《组件路径》';
|
|
|
-import { mapState } from 'vuex';
|
|
|
+import { mapState } from "vuex";
|
|
|
import { getLogin } from "@/api/ajax";
|
|
|
-import Upload from "../../../components/Upload.vue"
|
|
|
+import Upload from "../../../components/Upload.vue";
|
|
|
export default {
|
|
|
//import引入的组件需要注入到对象中才能使用
|
|
|
components: { Upload },
|
|
|
@@ -232,157 +447,155 @@ export default {
|
|
|
data() {
|
|
|
//这里存放数据
|
|
|
const validatePass = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请输入密码'));
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("请输入密码"));
|
|
|
+ } else {
|
|
|
+ let reg = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d]{6,16}$/;
|
|
|
+ let result = reg.test(value);
|
|
|
+ if (result) {
|
|
|
+ callback();
|
|
|
} else {
|
|
|
- let reg = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d]{6,16}$/;
|
|
|
- let result = reg.test(value);
|
|
|
- if (result) {
|
|
|
- callback();
|
|
|
- } else {
|
|
|
- callback(new Error('密码必须同时包含数字和大小写字母'));
|
|
|
- }
|
|
|
-
|
|
|
+ callback(new Error("密码必须同时包含数字和大小写字母"));
|
|
|
}
|
|
|
+ }
|
|
|
};
|
|
|
const validatePass2 = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请再次输入密码'));
|
|
|
- } else if (value !== this.passwordForm.newPwd) {
|
|
|
- callback(new Error('两次输入密码不一致!'));
|
|
|
- } else {
|
|
|
- callback();
|
|
|
- }
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("请再次输入密码"));
|
|
|
+ } else if (value !== this.passwordForm.newPwd) {
|
|
|
+ callback(new Error("两次输入密码不一致!"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
};
|
|
|
const validatePhone = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请输入手机号'));
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("请输入手机号"));
|
|
|
+ } else {
|
|
|
+ let reg = /^1[3-9]\d{9}$/;
|
|
|
+ let result = reg.test(value);
|
|
|
+ if (result) {
|
|
|
+ callback();
|
|
|
} else {
|
|
|
- let reg = /^1[3-9]\d{9}$/;
|
|
|
- let result = reg.test(value);
|
|
|
- if (result) {
|
|
|
- callback();
|
|
|
- } else {
|
|
|
- callback(new Error('请输入正确的手机号'));
|
|
|
- }
|
|
|
+ callback(new Error("请输入正确的手机号"));
|
|
|
}
|
|
|
+ }
|
|
|
};
|
|
|
const validateEmail = (rule, value, callback) => {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请输入邮箱地址'));
|
|
|
+ if (value === "") {
|
|
|
+ callback(new Error("请输入邮箱地址"));
|
|
|
+ } else {
|
|
|
+ let reg = /^[a-zA-Z0-9_\.-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
|
|
+ let result = reg.test(value);
|
|
|
+ if (result) {
|
|
|
+ callback();
|
|
|
} else {
|
|
|
- let reg = /^[a-zA-Z0-9_\.-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
|
|
- let result = reg.test(value);
|
|
|
- if (result) {
|
|
|
- callback();
|
|
|
- } else {
|
|
|
- callback(new Error('请输入正确的邮箱地址'));
|
|
|
- }
|
|
|
+ callback(new Error("请输入正确的邮箱地址"));
|
|
|
}
|
|
|
+ }
|
|
|
};
|
|
|
return {
|
|
|
- show: false, // 编辑头像flag
|
|
|
- tabsIndex: 0,
|
|
|
- personalInfo: null,
|
|
|
- infoForm:{
|
|
|
- name: '',
|
|
|
- realName:' ',
|
|
|
- sex: 1,
|
|
|
- selectedOptions: [],
|
|
|
- desc:'',
|
|
|
- region:'',
|
|
|
- cover_image_list: [],
|
|
|
- cover_image_id: null,
|
|
|
- },
|
|
|
- rules: {
|
|
|
- realName: [
|
|
|
- { required: true, message: '请输入真实姓名', trigger: 'blur' }
|
|
|
- ],
|
|
|
- region: [
|
|
|
- { required: true, message: '请选择机构', trigger: 'change' }
|
|
|
- ],
|
|
|
- selectedOptions: [
|
|
|
- { type: 'array', required: true, message: '请选择所在省市', trigger: 'change' }
|
|
|
- ],
|
|
|
- },
|
|
|
- regionFlag: true, // 修改机构
|
|
|
- settingFlag: false, // 修改设置
|
|
|
- passwordFlag: false, // 修改密码
|
|
|
- phoneFlag: false, // 修改手机
|
|
|
- emailFlag: false, // 修改邮箱
|
|
|
- passwordForm:{
|
|
|
- oldPwd:'', // 旧密码
|
|
|
- newPwd:'', // 新密码
|
|
|
- confirmPwd:'' // 确认密码
|
|
|
- },
|
|
|
- rulesPassword:{
|
|
|
- oldPwd:[
|
|
|
- { required: true, message: '请输入原始密码', trigger: 'blur' }
|
|
|
- ],
|
|
|
- newPwd:[
|
|
|
- { required: true, validator: validatePass, trigger: 'blur' },
|
|
|
- { min: 6, max: 16, message: '请输入 6-16 位密码，且必须同时包含数字和大小写字母', trigger:'change' },
|
|
|
- ],
|
|
|
- confirmPwd:[
|
|
|
- { required: true, validator: validatePass2, trigger: 'blur' }
|
|
|
- ]
|
|
|
- },
|
|
|
- oldPwdFlag: false, // 查看旧密码
|
|
|
- newPwdFlag: false, // 查看新密码
|
|
|
- comfirmPwdFlag: false, // 查看确认密码
|
|
|
- phoneForm:{
|
|
|
- oldPhone:'', // 旧手机
|
|
|
- oldCode:'', // 旧手机验证码
|
|
|
- newPhone:'', // 新手机
|
|
|
- newCode:'', // 新手机验证码
|
|
|
- },
|
|
|
- rulesPhone:{
|
|
|
- oldPhone:[
|
|
|
- { required: true, validator: validatePhone, trigger: 'blur' },
|
|
|
- ],
|
|
|
- oldCode:[
|
|
|
- { required: true, message: '请输入验证码', trigger: 'blur' }
|
|
|
- ],
|
|
|
- newPhone:[
|
|
|
- { required: true, validator: validatePhone, trigger: 'blur' },
|
|
|
- ],
|
|
|
- newCode:[
|
|
|
- { required: true, message: '请输入验证码', trigger: 'blur' }
|
|
|
- ]
|
|
|
- },
|
|
|
- time: 60, //获取验证码的时间
|
|
|
- verificationCodeShow: false, //是否已经获取了验证码
|
|
|
- times: 60, //获取验证码的时间
|
|
|
- verificationCodesShow: false, //是否已经获取了验证码
|
|
|
- timee: 60, //获取验证码的时间
|
|
|
- verificationCodeeShow: false, //是否已经获取了验证码
|
|
|
- emailForm:{
|
|
|
- email:'',
|
|
|
- code:''
|
|
|
- },
|
|
|
- rulesEmail:{
|
|
|
- email:[
|
|
|
- { required: true, validator: validateEmail, trigger: 'blur' },
|
|
|
- ],
|
|
|
- code:[
|
|
|
- { required: true, message: '请输入验证码', trigger: 'blur' }
|
|
|
- ]
|
|
|
- },
|
|
|
- loading: false,
|
|
|
- orgList: [],
|
|
|
- submitLoading: false,
|
|
|
- passwordLoading: false,
|
|
|
- timer: null
|
|
|
- }
|
|
|
+ show: false, // 编辑头像flag
|
|
|
+ tabsIndex: 0,
|
|
|
+ personalInfo: null,
|
|
|
+ infoForm: {
|
|
|
+ name: "",
|
|
|
+ realName: " ",
|
|
|
+ sex: 1,
|
|
|
+ selectedOptions: [],
|
|
|
+ desc: "",
|
|
|
+ region: "",
|
|
|
+ cover_image_list: [],
|
|
|
+ cover_image_id: null,
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
|
|
|
+ realName: [
|
|
|
+ { required: true, message: "请输入真实姓名", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ region: [{ required: true, message: "请选择机构", trigger: "change" }],
|
|
|
+ selectedOptions: [
|
|
|
+ {
|
|
|
+ type: "array",
|
|
|
+ required: true,
|
|
|
+ message: "请选择所在省市",
|
|
|
+ trigger: "change",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ regionFlag: true, // 修改机构
|
|
|
+ settingFlag: false, // 修改设置
|
|
|
+ passwordFlag: false, // 修改密码
|
|
|
+ phoneFlag: false, // 修改手机
|
|
|
+ emailFlag: false, // 修改邮箱
|
|
|
+ passwordForm: {
|
|
|
+ oldPwd: "", // 旧密码
|
|
|
+ newPwd: "", // 新密码
|
|
|
+ confirmPwd: "", // 确认密码
|
|
|
+ },
|
|
|
+ rulesPassword: {
|
|
|
+ oldPwd: [
|
|
|
+ { required: true, message: "请输入原始密码", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ newPwd: [
|
|
|
+ { required: true, validator: validatePass, trigger: "blur" },
|
|
|
+ {
|
|
|
+ min: 6,
|
|
|
+ max: 16,
|
|
|
+ message: "请输入 6-16 位密码，且必须同时包含数字和大小写字母",
|
|
|
+ trigger: "change",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ confirmPwd: [
|
|
|
+ { required: true, validator: validatePass2, trigger: "blur" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ oldPwdFlag: false, // 查看旧密码
|
|
|
+ newPwdFlag: false, // 查看新密码
|
|
|
+ comfirmPwdFlag: false, // 查看确认密码
|
|
|
+ phoneForm: {
|
|
|
+ oldPhone: "", // 旧手机
|
|
|
+ oldCode: "", // 旧手机验证码
|
|
|
+ newPhone: "", // 新手机
|
|
|
+ newCode: "", // 新手机验证码
|
|
|
+ },
|
|
|
+ rulesPhone: {
|
|
|
+ oldPhone: [
|
|
|
+ { required: true, validator: validatePhone, trigger: "blur" },
|
|
|
+ ],
|
|
|
+ oldCode: [{ required: true, message: "请输入验证码", trigger: "blur" }],
|
|
|
+ newPhone: [
|
|
|
+ { required: true, validator: validatePhone, trigger: "blur" },
|
|
|
+ ],
|
|
|
+ newCode: [{ required: true, message: "请输入验证码", trigger: "blur" }],
|
|
|
+ },
|
|
|
+ time: 60, //获取验证码的时间
|
|
|
+ verificationCodeShow: false, //是否已经获取了验证码
|
|
|
+ times: 60, //获取验证码的时间
|
|
|
+ verificationCodesShow: false, //是否已经获取了验证码
|
|
|
+ timee: 60, //获取验证码的时间
|
|
|
+ verificationCodeeShow: false, //是否已经获取了验证码
|
|
|
+ emailForm: {
|
|
|
+ email: "",
|
|
|
+ code: "",
|
|
|
+ },
|
|
|
+ rulesEmail: {
|
|
|
+ email: [{ required: true, validator: validateEmail, trigger: "blur" }],
|
|
|
+ code: [{ required: true, message: "请输入验证码", trigger: "blur" }],
|
|
|
+ },
|
|
|
+ loading: false,
|
|
|
+ orgList: [],
|
|
|
+ submitLoading: false,
|
|
|
+ passwordLoading: false,
|
|
|
+ timer: null,
|
|
|
+ };
|
|
|
},
|
|
|
//计算属性 类似于data概念
|
|
|
computed: {
|
|
|
- ...mapState(['$provinceCityList']),
|
|
|
+ ...mapState(["$provinceCityList"]),
|
|
|
},
|
|
|
//监控data中数据变化
|
|
|
- watch: {
|
|
|
-
|
|
|
- },
|
|
|
+ watch: {},
|
|
|
//方法集合
|
|
|
methods: {
|
|
|
// 编辑头像
|
|
|
@@ -390,637 +603,656 @@ export default {
|
|
|
this.show = !this.show;
|
|
|
},
|
|
|
// 切换tabs
|
|
|
- handleChangeTabs(value){
|
|
|
- this.tabsIndex = value
|
|
|
+ handleChangeTabs(value) {
|
|
|
+ this.tabsIndex = value;
|
|
|
},
|
|
|
- handleChangeFilters(item){
|
|
|
- console.log(item)
|
|
|
- // if(this.filterTypeArr.indexOf(value)==-1){
|
|
|
- // this.filterTypeArr.push(value)
|
|
|
- // }else{
|
|
|
- // this.filterTypeArr.splice(this.filterTypeArr.indexOf(value),1)
|
|
|
- // }
|
|
|
+ handleChangeFilters(item) {
|
|
|
+ console.log(item);
|
|
|
+ // if(this.filterTypeArr.indexOf(value)==-1){
|
|
|
+ // this.filterTypeArr.push(value)
|
|
|
+ // }else{
|
|
|
+ // this.filterTypeArr.splice(this.filterTypeArr.indexOf(value),1)
|
|
|
+ // }
|
|
|
},
|
|
|
// 查询词汇列表
|
|
|
- handleWordList(){
|
|
|
- this.filterTypeArr=[]
|
|
|
+ handleWordList() {
|
|
|
+ this.filterTypeArr = [];
|
|
|
},
|
|
|
// 级联选择器
|
|
|
- handleCity(value){
|
|
|
- // console.log(value)
|
|
|
+ handleCity(value) {
|
|
|
+ // console.log(value)
|
|
|
},
|
|
|
// 提交表单
|
|
|
- onSubmit(formName){
|
|
|
- this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.submitLoading = true
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/UpdateMyBaseInfo";
|
|
|
- let data = {
|
|
|
- user_name: this.infoForm.name,
|
|
|
- real_name: this.infoForm.realName,
|
|
|
- sex: this.infoForm.sex,
|
|
|
- city_id: this.infoForm.selectedOptions[1],
|
|
|
- memo: this.infoForm.desc,
|
|
|
- org_id: this.infoForm.region
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.submitLoading = true;
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/UpdateMyBaseInfo";
|
|
|
+ let data = {
|
|
|
+ user_name: this.infoForm.name,
|
|
|
+ real_name: this.infoForm.realName,
|
|
|
+ sex: this.infoForm.sex,
|
|
|
+ city_id: this.infoForm.selectedOptions[1],
|
|
|
+ memo: this.infoForm.desc,
|
|
|
+ org_id: this.infoForm.region,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.submitLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.getInfo()
|
|
|
- this.$message({
|
|
|
- message: '修改成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- this.submitLoading = false
|
|
|
+ this.submitLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.getInfo();
|
|
|
+ this.$message({
|
|
|
+ message: "修改成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ }
|
|
|
})
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
+ .catch((res) => {
|
|
|
+ this.submitLoading = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 取消 恢复到修改前状态
|
|
|
- onCancel(formName){
|
|
|
- this.$refs[formName].resetFields();
|
|
|
+ onCancel(formName) {
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
},
|
|
|
// 修改机构提交
|
|
|
- handleChangeOrg(){
|
|
|
- this.regionFlag = !this.regionFlag
|
|
|
+ handleChangeOrg() {
|
|
|
+ this.regionFlag = !this.regionFlag;
|
|
|
},
|
|
|
// 取消修改机构
|
|
|
- handleorgCancel(){
|
|
|
- this.regionFlag = !this.regionFlag
|
|
|
- // 注意把原来的值赋回去
|
|
|
+ handleorgCancel() {
|
|
|
+ this.regionFlag = !this.regionFlag;
|
|
|
+ // 注意把原来的值赋回去
|
|
|
},
|
|
|
// 修改设置
|
|
|
- handleSetting(flag){
|
|
|
- this.settingFlag = !this.settingFlag
|
|
|
- this[flag] = !this[flag]
|
|
|
+ handleSetting(flag) {
|
|
|
+ this.settingFlag = !this.settingFlag;
|
|
|
+ this[flag] = !this[flag];
|
|
|
},
|
|
|
- changeIcon(flag){
|
|
|
- this[flag] = !this[flag]
|
|
|
+ changeIcon(flag) {
|
|
|
+ this[flag] = !this[flag];
|
|
|
},
|
|
|
// 修改密码提交表单
|
|
|
- onSubmitPassword(formName){
|
|
|
- this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.passwordLoading = true
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/UpdateMyPassword";
|
|
|
- let data = {
|
|
|
- password_old: this.passwordForm.oldPwd,
|
|
|
- password: this.passwordForm.newPwd
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ onSubmitPassword(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.passwordLoading = true;
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/UpdateMyPassword";
|
|
|
+ let data = {
|
|
|
+ password_old: this.passwordForm.oldPwd,
|
|
|
+ password: this.passwordForm.newPwd,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.passwordLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.$message({
|
|
|
- message: '修改成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- this.handleSetting('passwordFlag')
|
|
|
- this.passwordForm.oldPwd = ''
|
|
|
- this.passwordForm.newPwd = ''
|
|
|
- this.passwordForm.confirmPwd = ''
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- this.passwordLoading = false
|
|
|
+ this.passwordLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.$message({
|
|
|
+ message: "修改成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ this.handleSetting("passwordFlag");
|
|
|
+ this.passwordForm.oldPwd = "";
|
|
|
+ this.passwordForm.newPwd = "";
|
|
|
+ this.passwordForm.confirmPwd = "";
|
|
|
+ }
|
|
|
})
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
+ .catch((res) => {
|
|
|
+ this.passwordLoading = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 修改手机提交表单
|
|
|
- onSubmitPhone(formName){
|
|
|
- this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.passwordLoading = true
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/UpdateMyPhone";
|
|
|
- let data = {
|
|
|
- phone: this.phoneForm.newPhone,
|
|
|
- dynamic_verification_code: this.phoneForm.newCode
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ onSubmitPhone(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.passwordLoading = true;
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/UpdateMyPhone";
|
|
|
+ let data = {
|
|
|
+ phone: this.phoneForm.newPhone,
|
|
|
+ dynamic_verification_code: this.phoneForm.newCode,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.passwordLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.$message({
|
|
|
- message: '修改成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- this.getInfo()
|
|
|
- this.handleSetting('phoneFlag')
|
|
|
- this.phoneForm.newPhone = ''
|
|
|
- this.phoneForm.newCode = ''
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- clearInterval(this.timer);
|
|
|
- this.timer = null;
|
|
|
- this.times = 60;
|
|
|
- this.timee = 60;
|
|
|
- this.passwordLoading = false
|
|
|
- this.verificationCodeeShow = false
|
|
|
- this.verificationCodesShow = false
|
|
|
+ this.passwordLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.$message({
|
|
|
+ message: "修改成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ this.getInfo();
|
|
|
+ this.handleSetting("phoneFlag");
|
|
|
+ this.phoneForm.newPhone = "";
|
|
|
+ this.phoneForm.newCode = "";
|
|
|
+ }
|
|
|
})
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
+ .catch((res) => {
|
|
|
+ clearInterval(this.timer);
|
|
|
+ this.timer = null;
|
|
|
+ this.times = 60;
|
|
|
+ this.timee = 60;
|
|
|
+ this.passwordLoading = false;
|
|
|
+ this.verificationCodeeShow = false;
|
|
|
+ this.verificationCodesShow = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 修改邮箱
|
|
|
- onSubmitEmail(formName){
|
|
|
- this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.passwordLoading = true
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/UpdateMyEmail";
|
|
|
- let data = {
|
|
|
- dynamic_verification_code: this.emailForm.code,
|
|
|
- email: this.emailForm.email
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ onSubmitEmail(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.passwordLoading = true;
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/UpdateMyEmail";
|
|
|
+ let data = {
|
|
|
+ dynamic_verification_code: this.emailForm.code,
|
|
|
+ email: this.emailForm.email,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.passwordLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.$message({
|
|
|
- message: '修改成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- this.getInfo()
|
|
|
- this.handleSetting('emailFlag')
|
|
|
- this.emailForm.code = ''
|
|
|
- this.emailForm.email = ''
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- this.passwordLoading = false
|
|
|
- clearInterval(this.timer);
|
|
|
- this.timer = null;
|
|
|
- this.times = 60;
|
|
|
- this.timee = 60;
|
|
|
- this.verificationCodeeShow = false
|
|
|
- this.verificationCodesShow = false
|
|
|
+ this.passwordLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.$message({
|
|
|
+ message: "修改成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ this.getInfo();
|
|
|
+ this.handleSetting("emailFlag");
|
|
|
+ this.emailForm.code = "";
|
|
|
+ this.emailForm.email = "";
|
|
|
+ }
|
|
|
})
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
+ .catch((res) => {
|
|
|
+ this.passwordLoading = false;
|
|
|
+ clearInterval(this.timer);
|
|
|
+ this.timer = null;
|
|
|
+ this.times = 60;
|
|
|
+ this.timee = 60;
|
|
|
+ this.verificationCodeeShow = false;
|
|
|
+ this.verificationCodesShow = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 发送验证码
|
|
|
- sendCode(time,phone,flag,obj){
|
|
|
- let this_ = this;
|
|
|
- if(this_[time] != 60){
|
|
|
- return
|
|
|
- }
|
|
|
- this_.timer = null;
|
|
|
- // 修改手机号
|
|
|
- if(!obj){
|
|
|
- if (this_.phoneForm[phone]) {
|
|
|
- let reg = /^1[3-9]\d{9}$/;
|
|
|
- let result = reg.test(this_.phoneForm[phone]);
|
|
|
- if (!result) {
|
|
|
- this_.$message.warning('请输入正确的手机号');
|
|
|
- return
|
|
|
- }
|
|
|
- this_[flag] = true;
|
|
|
- this_.timer = setInterval(() => {
|
|
|
- this_[time]--;
|
|
|
- if (this_[time] == 0) {
|
|
|
- this_[flag] = false;
|
|
|
- clearInterval(this_.timer);
|
|
|
- this_.timer = null;
|
|
|
- this_[time] = 60;
|
|
|
- }
|
|
|
- }, 1000);
|
|
|
- let MethodName = "/OrgServer/LoginControl/SendVerificationCode";
|
|
|
- let data = {
|
|
|
- send_type: 'SMS',
|
|
|
- phone_or_email: this_.phoneForm[phone],
|
|
|
- };
|
|
|
- getLogin(MethodName, data).then((res) => {
|
|
|
- }).catch(()=>{
|
|
|
- this_[flag] = false;
|
|
|
- clearInterval(this_.timer);
|
|
|
- this_.timer = null;
|
|
|
- this_[time] = 60;
|
|
|
- });
|
|
|
- } else {
|
|
|
- this_.$message.warning('请先输入手机号');
|
|
|
+ sendCode(time, phone, flag, obj) {
|
|
|
+ let this_ = this;
|
|
|
+ if (this_[time] != 60) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this_.timer = null;
|
|
|
+ // 修改手机号
|
|
|
+ if (!obj) {
|
|
|
+ if (this_.phoneForm[phone]) {
|
|
|
+ let reg = /^1[3-9]\d{9}$/;
|
|
|
+ let result = reg.test(this_.phoneForm[phone]);
|
|
|
+ if (!result) {
|
|
|
+ this_.$message.warning("请输入正确的手机号");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this_[flag] = true;
|
|
|
+ this_.timer = setInterval(() => {
|
|
|
+ this_[time]--;
|
|
|
+ if (this_[time] == 0) {
|
|
|
+ this_[flag] = false;
|
|
|
+ clearInterval(this_.timer);
|
|
|
+ this_.timer = null;
|
|
|
+ this_[time] = 60;
|
|
|
}
|
|
|
- }else{
|
|
|
- // 修改邮箱
|
|
|
- if (this_.emailForm[phone]) {
|
|
|
- let reg = /^[a-zA-Z0-9_\.-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
|
|
- let result = reg.test(this_.emailForm[phone]);
|
|
|
- if (!result) {
|
|
|
- this_.$message.warning('请输入正确的邮箱地址');
|
|
|
- return
|
|
|
- }
|
|
|
- this_[flag] = true;
|
|
|
- this_.timer = setInterval(() => {
|
|
|
- this_[time]--;
|
|
|
- if (this_[time] == 0) {
|
|
|
- this_[flag] = false;
|
|
|
- clearInterval(this_.timer);
|
|
|
- this_.timer = null;
|
|
|
- this_[time] = 60;
|
|
|
- }
|
|
|
- }, 1000);
|
|
|
- let MethodName = "/OrgServer/LoginControl/SendVerificationCode";
|
|
|
- let data = {
|
|
|
- send_type: 'EMAIL',
|
|
|
- phone_or_email: this_.emailForm[phone],
|
|
|
- };
|
|
|
- getLogin(MethodName, data).then((res) => {
|
|
|
- }).catch(()=>{
|
|
|
- this_[flag] = false;
|
|
|
- clearInterval(this_.timer);
|
|
|
- this_.timer = null;
|
|
|
- this_[time] = 60;
|
|
|
- });
|
|
|
- } else {
|
|
|
- this_.$message.warning('请先输入邮箱');
|
|
|
+ }, 1000);
|
|
|
+ let MethodName = "/OrgServer/LoginControl/SendVerificationCode";
|
|
|
+ let data = {
|
|
|
+ send_type: "SMS",
|
|
|
+ phone_or_email: this_.phoneForm[phone],
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
+ .then((res) => {})
|
|
|
+ .catch(() => {
|
|
|
+ this_[flag] = false;
|
|
|
+ clearInterval(this_.timer);
|
|
|
+ this_.timer = null;
|
|
|
+ this_[time] = 60;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this_.$message.warning("请先输入手机号");
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 修改邮箱
|
|
|
+ if (this_.emailForm[phone]) {
|
|
|
+ let reg = /^[a-zA-Z0-9_\.-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
|
|
+ let result = reg.test(this_.emailForm[phone]);
|
|
|
+ if (!result) {
|
|
|
+ this_.$message.warning("请输入正确的邮箱地址");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this_[flag] = true;
|
|
|
+ this_.timer = setInterval(() => {
|
|
|
+ this_[time]--;
|
|
|
+ if (this_[time] == 0) {
|
|
|
+ this_[flag] = false;
|
|
|
+ clearInterval(this_.timer);
|
|
|
+ this_.timer = null;
|
|
|
+ this_[time] = 60;
|
|
|
}
|
|
|
+ }, 1000);
|
|
|
+ let MethodName = "/OrgServer/LoginControl/SendVerificationCode";
|
|
|
+ let data = {
|
|
|
+ send_type: "EMAIL",
|
|
|
+ phone_or_email: this_.emailForm[phone],
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
+ .then((res) => {})
|
|
|
+ .catch(() => {
|
|
|
+ this_[flag] = false;
|
|
|
+ clearInterval(this_.timer);
|
|
|
+ this_.timer = null;
|
|
|
+ this_[time] = 60;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this_.$message.warning("请先输入邮箱");
|
|
|
}
|
|
|
-
|
|
|
+ }
|
|
|
},
|
|
|
- getInfo(){
|
|
|
- this.loading = true
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/GetMyInfo";
|
|
|
- let data = {}
|
|
|
- getLogin(MethodName, data)
|
|
|
+ getInfo() {
|
|
|
+ this.loading = true;
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/GetMyInfo";
|
|
|
+ let data = {};
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.loading = false
|
|
|
- if(res.status===1){
|
|
|
- this.personalInfo = res.person
|
|
|
- this.infoForm = {
|
|
|
- name: this.personalInfo.user_name,
|
|
|
- realName: this.personalInfo.real_name,
|
|
|
- sex: this.personalInfo.sex,
|
|
|
- selectedOptions: this.personalInfo.province_id&&this.personalInfo.city_id?[this.personalInfo.province_id,this.personalInfo.city_id]:[],
|
|
|
- desc: this.personalInfo.memo,
|
|
|
- region: this.personalInfo.org_id,
|
|
|
- cover_image_list: [],
|
|
|
- cover_image_id: null,
|
|
|
- }
|
|
|
- this.$emit('changeTouxiang',this.personalInfo.image_url)
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- this.loading = false
|
|
|
+ this.loading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.personalInfo = res.person;
|
|
|
+ this.infoForm = {
|
|
|
+ name: this.personalInfo.user_name,
|
|
|
+ realName: this.personalInfo.real_name,
|
|
|
+ sex: this.personalInfo.sex,
|
|
|
+ selectedOptions:
|
|
|
+ this.personalInfo.province_id && this.personalInfo.city_id
|
|
|
+ ? [this.personalInfo.province_id, this.personalInfo.city_id]
|
|
|
+ : [],
|
|
|
+ desc: this.personalInfo.memo,
|
|
|
+ region: this.personalInfo.org_id,
|
|
|
+ cover_image_list: [],
|
|
|
+ cover_image_id: null,
|
|
|
+ };
|
|
|
+ this.$emit("changeTouxiang", this.personalInfo.image_url);
|
|
|
+ }
|
|
|
})
|
|
|
+ .catch((res) => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
},
|
|
|
- handleAvatarSuccess(fileList,name) {
|
|
|
- let MethodName = "/OrgServer/Client/PersonManager/UpdateMyImage";
|
|
|
- let data = {
|
|
|
- image_id: fileList.length>0&&fileList[fileList.length-1].response&&fileList[fileList.length-1].response.file_info_list&&fileList[fileList.length-1].response.file_info_list[0]?fileList[fileList.length-1].response.file_info_list[0].file_id:''
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ handleAvatarSuccess(fileList, name) {
|
|
|
+ let MethodName = "/OrgServer/Client/PersonManager/UpdateMyImage";
|
|
|
+ let data = {
|
|
|
+ image_id:
|
|
|
+ fileList.length > 0 &&
|
|
|
+ fileList[fileList.length - 1].response &&
|
|
|
+ fileList[fileList.length - 1].response.file_info_list &&
|
|
|
+ fileList[fileList.length - 1].response.file_info_list[0]
|
|
|
+ ? fileList[fileList.length - 1].response.file_info_list[0].file_id
|
|
|
+ : "",
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- if(res.status===1){
|
|
|
- this.getInfo()
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.getInfo();
|
|
|
+ }
|
|
|
})
|
|
|
+ .catch((res) => {});
|
|
|
},
|
|
|
// 查询列表
|
|
|
- getOrgList(){
|
|
|
- let MethodName = "/OrgServer/Client/OrgManager/GetOrgIndexList";
|
|
|
- let data = {
|
|
|
- name: '',
|
|
|
- status: 1,
|
|
|
- sn: ''
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ getOrgList() {
|
|
|
+ let MethodName = "/OrgServer/Client/OrgManager/GetOrgIndexList";
|
|
|
+ let data = {
|
|
|
+ name: "",
|
|
|
+ status: 1,
|
|
|
+ sn: "",
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- if(res.status===1){
|
|
|
- this.orgList = res.org_index_list
|
|
|
- }
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.orgList = res.org_index_list;
|
|
|
+ }
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- this.loading = false
|
|
|
+ this.loading = false;
|
|
|
});
|
|
|
},
|
|
|
// 去掉前后空格
|
|
|
- handleTrim(form,fild){
|
|
|
- this[form][fild] = this[form][fild].trim()
|
|
|
+ handleTrim(form, fild) {
|
|
|
+ this[form][fild] = this[form][fild].trim();
|
|
|
},
|
|
|
},
|
|
|
//生命周期 - 创建完成（可以访问当前this实例）
|
|
|
created() {
|
|
|
- this.getOrgList()
|
|
|
- this.getInfo()
|
|
|
+ this.getOrgList();
|
|
|
+ this.getInfo();
|
|
|
},
|
|
|
//生命周期 - 挂载完成（可以访问DOM元素）
|
|
|
- mounted() {
|
|
|
- },
|
|
|
+ mounted() {},
|
|
|
//生命周期-创建之前
|
|
|
- beforeCreated() { },
|
|
|
+ beforeCreated() {},
|
|
|
//生命周期-挂载之前
|
|
|
- beforeMount() { },
|
|
|
+ beforeMount() {},
|
|
|
//生命周期-更新之前
|
|
|
- beforUpdate() { },
|
|
|
+ beforUpdate() {},
|
|
|
//生命周期-更新之后
|
|
|
- updated() { },
|
|
|
+ updated() {},
|
|
|
//生命周期-销毁之前
|
|
|
- beforeDestory() { },
|
|
|
+ beforeDestory() {},
|
|
|
//生命周期-销毁完成
|
|
|
- destoryed() { },
|
|
|
+ destoryed() {},
|
|
|
//如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
- activated() { }
|
|
|
-}
|
|
|
+ activated() {},
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
/* @import url(); 引入css类 */
|
|
|
-.setting{
|
|
|
- height: 100%;
|
|
|
- &-top{
|
|
|
- margin: 0 0 12px 0;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 8px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- padding: 22px 40px;
|
|
|
- .avator-box{
|
|
|
- width: 96px;
|
|
|
- height: 96px;
|
|
|
- position: relative;
|
|
|
- .img-crop{
|
|
|
- position: absolute;
|
|
|
- // padding: 4px;
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- right: -4px;
|
|
|
- bottom: -4px;
|
|
|
- border-radius: 50%;
|
|
|
- display: block;
|
|
|
- text-align: center;
|
|
|
- font-size: 0;
|
|
|
- border: 2px solid #FFFFFF;
|
|
|
- background: #F2F3F5 url("../../../assets/camera.png") center no-repeat;
|
|
|
- background-size: 12px;
|
|
|
- }
|
|
|
- .el-image{
|
|
|
- border-radius: 50%;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
- }
|
|
|
- .center{
|
|
|
- flex: 1;
|
|
|
- display: flex;
|
|
|
- flex-flow: wrap;
|
|
|
- margin-top: 12px;
|
|
|
- .info-items{
|
|
|
- margin-bottom: 12px;
|
|
|
- width: 37%;
|
|
|
- }
|
|
|
- label{
|
|
|
- font-weight: 400;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #86909C;
|
|
|
- width: 156px;
|
|
|
- text-align: right;
|
|
|
- display: inline-block;
|
|
|
- padding-right: 10px;
|
|
|
- }
|
|
|
- span{
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #1D2129;
|
|
|
- }
|
|
|
- }
|
|
|
+.setting {
|
|
|
+ height: 100%;
|
|
|
+ &-top {
|
|
|
+ margin: 0 0 12px 0;
|
|
|
+ background: #ffffff;
|
|
|
+ border-radius: 8px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ padding: 22px 40px;
|
|
|
+ .avator-box {
|
|
|
+ width: 96px;
|
|
|
+ height: 96px;
|
|
|
+ position: relative;
|
|
|
+ .img-crop {
|
|
|
+ position: absolute;
|
|
|
+ // padding: 4px;
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ right: -4px;
|
|
|
+ bottom: -4px;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: block;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0;
|
|
|
+ border: 2px solid #ffffff;
|
|
|
+ background: #f2f3f5 url("../../../assets/camera.png") center no-repeat;
|
|
|
+ background-size: 12px;
|
|
|
+ }
|
|
|
+ .el-image {
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
}
|
|
|
- &-bottom{
|
|
|
- padding: 24px;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 4px;
|
|
|
- min-height: calc(100vh - 270px);
|
|
|
- .tabs-box{
|
|
|
- display: flex;
|
|
|
- padding-bottom: 16px;
|
|
|
- a{
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #4E5969;
|
|
|
- border-radius: 100px;
|
|
|
- padding: 5px 16px;
|
|
|
- margin-right: 12px;
|
|
|
- &:hover{
|
|
|
- background: #F2F3F5;
|
|
|
- }
|
|
|
- &.active{
|
|
|
- background: #F2F3F5;
|
|
|
- font-weight: 500;
|
|
|
- color: #165DFF;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .btn{
|
|
|
- margin-left: 16px;
|
|
|
- }
|
|
|
- .safe-items{
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- padding: 30px 20px 13px 20px;
|
|
|
- label{
|
|
|
- font-weight: 500;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #4E5969;
|
|
|
- }
|
|
|
- &-right{
|
|
|
- border-bottom: 1px solid #E5E6EB;
|
|
|
- padding-bottom: 20px;
|
|
|
- flex: 1;
|
|
|
- margin-left: 16px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- p{
|
|
|
- margin: 0;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #4E5969;
|
|
|
- &.noContent{
|
|
|
- color: #86909C;
|
|
|
- }
|
|
|
- }
|
|
|
- a{
|
|
|
- font-weight: 400;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #165DFF;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .center {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-flow: wrap;
|
|
|
+ margin-top: 12px;
|
|
|
+ .info-items {
|
|
|
+ margin-bottom: 12px;
|
|
|
+ width: 37%;
|
|
|
+ }
|
|
|
+ label {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #86909c;
|
|
|
+ width: 156px;
|
|
|
+ text-align: right;
|
|
|
+ display: inline-block;
|
|
|
+ padding-right: 10px;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #1d2129;
|
|
|
+ }
|
|
|
}
|
|
|
- &-iframe{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background: #FFFFFF;
|
|
|
- padding: 24px;
|
|
|
- .title{
|
|
|
- margin: 0;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 20px;
|
|
|
- line-height: 28px;
|
|
|
- color: #000000;
|
|
|
- .el-icon-arrow-left{
|
|
|
- margin-right: 8px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
- .passwordForm,.phoneForm,.emailForm{
|
|
|
- padding-top: 40px;
|
|
|
- .show-icon{
|
|
|
- cursor: pointer;
|
|
|
- color: #4E5969;
|
|
|
- }
|
|
|
+ }
|
|
|
+ &-bottom {
|
|
|
+ padding: 24px;
|
|
|
+ background: #ffffff;
|
|
|
+ border-radius: 4px;
|
|
|
+ min-height: calc(100vh - 270px);
|
|
|
+ .tabs-box {
|
|
|
+ display: flex;
|
|
|
+ padding-bottom: 16px;
|
|
|
+ a {
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #4e5969;
|
|
|
+ border-radius: 100px;
|
|
|
+ padding: 5px 16px;
|
|
|
+ margin-right: 12px;
|
|
|
+ &:hover {
|
|
|
+ background: #f2f3f5;
|
|
|
}
|
|
|
- .code-input{
|
|
|
- width: 268px;
|
|
|
- .el-input__inner{
|
|
|
- border-radius: 2px 0 0 2px;
|
|
|
- }
|
|
|
+ &.active {
|
|
|
+ background: #f2f3f5;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #165dff;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
-</style>
|
|
|
-<style lang="scss">
|
|
|
-.setting{
|
|
|
- .el-input,.el-textarea{
|
|
|
- width: 360px;
|
|
|
- }
|
|
|
- .el-input__inner{
|
|
|
- height: 32px;
|
|
|
- color: #1D2129;
|
|
|
- background: #F2F3F5;
|
|
|
- border: none;
|
|
|
+ .btn {
|
|
|
+ margin-left: 16px;
|
|
|
}
|
|
|
- .el-textarea__inner,.el-input-group__prepend{
|
|
|
- color: #1D2129;
|
|
|
- background: #F2F3F5;
|
|
|
- border: none;
|
|
|
- }
|
|
|
- .el-input__count{
|
|
|
- background: #F2F3F5;
|
|
|
- }
|
|
|
- .el-form-item__label{
|
|
|
- font-weight: 400;
|
|
|
+ .safe-items {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ padding: 30px 20px 13px 20px;
|
|
|
+ label {
|
|
|
+ font-weight: 500;
|
|
|
font-size: 14px;
|
|
|
- line-height: 32px;
|
|
|
- color: #4E5969;
|
|
|
- }
|
|
|
- .el-form-item__content,.el-input__icon{
|
|
|
- line-height: 32px;
|
|
|
- color: #4E5969 !important;
|
|
|
- }
|
|
|
- .el-form-item{
|
|
|
- margin-bottom: 20px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #4e5969;
|
|
|
+ }
|
|
|
+ &-right {
|
|
|
+ border-bottom: 1px solid #e5e6eb;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ flex: 1;
|
|
|
+ margin-left: 16px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ p {
|
|
|
+ margin: 0;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #4e5969;
|
|
|
+ &.noContent {
|
|
|
+ color: #86909c;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ a {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #165dff;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- .el-radio__input.is-checked+.el-radio__label{
|
|
|
- color: #165DFF;
|
|
|
+ }
|
|
|
+ &-iframe {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #ffffff;
|
|
|
+ padding: 24px;
|
|
|
+ .title {
|
|
|
+ margin: 0;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 28px;
|
|
|
+ color: #000000;
|
|
|
+ .el-icon-arrow-left {
|
|
|
+ margin-right: 8px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
}
|
|
|
- .el-radio__input.is-checked .el-radio__inner{
|
|
|
- background: #165DFF;
|
|
|
- border-color: #165DFF;
|
|
|
+ .passwordForm,
|
|
|
+ .phoneForm,
|
|
|
+ .emailForm {
|
|
|
+ padding-top: 40px;
|
|
|
+ .show-icon {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #4e5969;
|
|
|
+ }
|
|
|
}
|
|
|
- .el-button--primary{
|
|
|
- background: #165DFF;
|
|
|
- border-color: #165DFF;
|
|
|
- border-radius: 2px;
|
|
|
- &:hover{
|
|
|
- background: #4080FF;
|
|
|
- border-color: #4080FF;
|
|
|
- }
|
|
|
- &:focus{
|
|
|
- background: #0E42D2;
|
|
|
- border-color: #0E42D2;
|
|
|
- }
|
|
|
+ .code-input {
|
|
|
+ width: 268px;
|
|
|
+ .el-input__inner {
|
|
|
+ border-radius: 2px 0 0 2px;
|
|
|
+ }
|
|
|
}
|
|
|
- .el-button--default{
|
|
|
- background: #F2F3F5;
|
|
|
- border-radius: 2px;
|
|
|
- border: none;
|
|
|
- color: #4E5969;
|
|
|
- height: 32px;
|
|
|
- &:hover{
|
|
|
- background: #E5E6EB;
|
|
|
- }
|
|
|
- &:focus{
|
|
|
- background: #C9CDD4;
|
|
|
- }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+.setting {
|
|
|
+ .el-input,
|
|
|
+ .el-textarea {
|
|
|
+ width: 360px;
|
|
|
+ }
|
|
|
+ .el-input__inner {
|
|
|
+ height: 32px;
|
|
|
+ color: #1d2129;
|
|
|
+ background: #f2f3f5;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .el-textarea__inner,
|
|
|
+ .el-input-group__prepend {
|
|
|
+ color: #1d2129;
|
|
|
+ background: #f2f3f5;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .el-input__count {
|
|
|
+ background: #f2f3f5;
|
|
|
+ }
|
|
|
+ .el-form-item__label {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 32px;
|
|
|
+ color: #4e5969;
|
|
|
+ }
|
|
|
+ .el-form-item__content,
|
|
|
+ .el-input__icon {
|
|
|
+ line-height: 32px;
|
|
|
+ color: #4e5969 !important;
|
|
|
+ }
|
|
|
+ .el-form-item {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ .el-radio__input.is-checked + .el-radio__label {
|
|
|
+ color: #165dff;
|
|
|
+ }
|
|
|
+ .el-radio__input.is-checked .el-radio__inner {
|
|
|
+ background: #165dff;
|
|
|
+ border-color: #165dff;
|
|
|
+ }
|
|
|
+ .el-button--primary {
|
|
|
+ background: #165dff;
|
|
|
+ border-color: #165dff;
|
|
|
+ border-radius: 2px;
|
|
|
+ &:hover {
|
|
|
+ background: #4080ff;
|
|
|
+ border-color: #4080ff;
|
|
|
}
|
|
|
- .setting-form{
|
|
|
- padding-top: 26px;
|
|
|
+ &:focus {
|
|
|
+ background: #0e42d2;
|
|
|
+ border-color: #0e42d2;
|
|
|
}
|
|
|
- .code-box{
|
|
|
- .el-form-item__content{
|
|
|
- display: flex;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .el-button--default {
|
|
|
+ background: #f2f3f5;
|
|
|
+ border-radius: 2px;
|
|
|
+ border: none;
|
|
|
+ color: #4e5969;
|
|
|
+ height: 32px;
|
|
|
+ &:hover {
|
|
|
+ background: #e5e6eb;
|
|
|
}
|
|
|
- .code-input{
|
|
|
- height: 32px;
|
|
|
- .el-input__inner{
|
|
|
- border-radius: 4px 0 0 4px;
|
|
|
- }
|
|
|
+ &:focus {
|
|
|
+ background: #c9cdd4;
|
|
|
}
|
|
|
- .sendCode{
|
|
|
- border-radius: 0 4px 4px 0;
|
|
|
- margin-top: 1px;
|
|
|
- width: 92px;
|
|
|
+ }
|
|
|
+ .setting-form {
|
|
|
+ padding-top: 26px;
|
|
|
+ }
|
|
|
+ .code-box {
|
|
|
+ .el-form-item__content {
|
|
|
+ display: flex;
|
|
|
}
|
|
|
- .el-input-group__prepend{
|
|
|
- width: 54px;
|
|
|
- height: 32px;
|
|
|
- border: none;
|
|
|
- background: #F2F3F5;
|
|
|
- border-radius: 2px 0px 0px 2px;
|
|
|
- line-height: 32px;
|
|
|
- text-align: center;
|
|
|
- padding: 0;
|
|
|
+ }
|
|
|
+ .code-input {
|
|
|
+ height: 32px;
|
|
|
+ .el-input__inner {
|
|
|
+ border-radius: 4px 0 0 4px;
|
|
|
}
|
|
|
- .el-input-group--prepend{
|
|
|
- display: flex;
|
|
|
- .el-input__inner{
|
|
|
- margin-left: 8px;
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .sendCode {
|
|
|
+ border-radius: 0 4px 4px 0;
|
|
|
+ margin-top: 1px;
|
|
|
+ width: 92px;
|
|
|
+ }
|
|
|
+ .el-input-group__prepend {
|
|
|
+ width: 54px;
|
|
|
+ height: 32px;
|
|
|
+ border: none;
|
|
|
+ background: #f2f3f5;
|
|
|
+ border-radius: 2px 0px 0px 2px;
|
|
|
+ line-height: 32px;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ .el-input-group--prepend {
|
|
|
+ display: flex;
|
|
|
+ .el-input__inner {
|
|
|
+ margin-left: 8px;
|
|
|
+ flex: 1;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
-.personal-setting{
|
|
|
- .upload{
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- overflow: hidden;
|
|
|
- .upload-demo{
|
|
|
- opacity: 0;
|
|
|
- width: 100% !important;
|
|
|
- }
|
|
|
+.personal-setting {
|
|
|
+ .upload {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ overflow: hidden;
|
|
|
+ .upload-demo {
|
|
|
+ opacity: 0;
|
|
|
+ width: 100% !important;
|
|
|
}
|
|
|
- .audit-status{
|
|
|
- border: none;
|
|
|
- margin-left: 16px;
|
|
|
- border-radius: 2px;
|
|
|
- background:#E8F7FF;
|
|
|
- padding: 1px 8px;
|
|
|
- color: #3491FA;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 500;
|
|
|
- line-height: 22px;
|
|
|
- height: 24px;
|
|
|
- .svg-icon{
|
|
|
- margin-right: 4px;
|
|
|
- }
|
|
|
- &.audit-refused{
|
|
|
- color: #F53F3F;
|
|
|
- background: #FFECE8;
|
|
|
- .el-icon-error{
|
|
|
- margin-right: 4px;
|
|
|
- }
|
|
|
- }
|
|
|
+ }
|
|
|
+ .audit-status {
|
|
|
+ border: none;
|
|
|
+ margin-left: 16px;
|
|
|
+ border-radius: 2px;
|
|
|
+ background: #e8f7ff;
|
|
|
+ padding: 1px 8px;
|
|
|
+ color: #3491fa;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 500;
|
|
|
+ line-height: 22px;
|
|
|
+ height: 24px;
|
|
|
+ .svg-icon {
|
|
|
+ margin-right: 4px;
|
|
|
}
|
|
|
+ &.audit-refused {
|
|
|
+ color: #f53f3f;
|
|
|
+ background: #ffece8;
|
|
|
+ .el-icon-error {
|
|
|
+ margin-right: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
natasha