end7less
/
program_xm_vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

优化用户头像

master
陈裕财 3 years ago
parent
dc337e1d63
commit
b3c65bcfc9
5 changed files with 41 additions and 15 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      src/api/imgUtil.js
  2. 2
      src/components/MdpSelectUserX/index.vue
  3. 38
      src/views/xm/core/components/MdpSelectUserXm/index.vue
  4. 2
      src/views/xm/core/xmMenu/XmMenuEdit.vue
  5. 4
      src/views/xm/core/xmTask/XmTaskEdit.vue

8
src/api/imgUtil.js
View File

@ -89,9 +89,11 @@ h55,h56,h57,h58,h59,h60,h61,h62,h63,h64,h64,h66,h67,h68,h69,h70
export default { export default {
onImgError:function(userid,$event){ onImgError:function(userid,$event){
debugger;
let img = $event.srcElement; let img = $event.srcElement;
img.src = this.getDefHeadimg(userid) img.src = this.getDefHeadimg(userid)
img.onerror = null; //防止闪图 img.onerror = null; //防止闪图
return false;
}, },
/** /**
@ -122,11 +124,15 @@ getDefHeadimg:function(userid){
* @returns * @returns
*/ */
getHeadimgurl:function (userid,headimgurl,rand) { getHeadimgurl:function (userid,headimgurl,rand) {
debugger;
if(!userid){
return null;
}
if(headimgurl){ if(headimgurl){
return headimgurl; return headimgurl;
}else{ }else{
var authorStr=sessionStorage.getItem('authorMsg_' + userid) var authorStr=sessionStorage.getItem('authorMsg_' + userid)
if(authorStr){
if(authorStr&&authorStr!='null'&& authorStr!='undefined'){
var author=JSON.parse(authorStr) var author=JSON.parse(authorStr)
if(author && author.headimgurl){ if(author && author.headimgurl){
return author.headimgurl return author.headimgurl

2
src/components/MdpSelectUserX/index.vue
View File

@ -53,6 +53,7 @@
computed: { computed: {
avaterCpd(){ avaterCpd(){
debugger;
var isEmpty=this.isEmpty(this.myVal) var isEmpty=this.isEmpty(this.myVal)
var username=isEmpty?"":(this.myVal.username?this.myVal.username:this.myVal.userid) var username=isEmpty?"":(this.myVal.username?this.myVal.username:this.myVal.userid)
var obj={isNull:isEmpty,icon:'el-icon-user',color:'#E4E7ED',innerText:username,userid:'',headimgurl:''} var obj={isNull:isEmpty,icon:'el-icon-user',color:'#E4E7ED',innerText:username,userid:'',headimgurl:''}
@ -105,6 +106,7 @@
}, },
myVal(){ myVal(){
debugger;
if(!this.myVal||!this.myVal.userid){ if(!this.myVal||!this.myVal.userid){
if(this.value && this.value[this.useridKey]){ if(this.value && this.value[this.useridKey]){
this.value[this.useridKey]="" this.value[this.useridKey]=""

38
src/views/xm/core/components/MdpSelectUserXm/index.vue
View File

@ -1,7 +1,13 @@
<template> <template>
<el-row> <el-row>
<div class="field-box"> <div class="field-box">
<el-avatar class="field-avater" :class="{'dashed-circle':avaterCpd.isNull}" :icon="avaterCpd.icon" :style="{backgroundColor:avaterCpd.color}">{{avaterCpd.innerText}}</el-avatar>
<div class="avatar-container">
<div class="avatar-wrapper">
<img v-if="avaterCpd.userid" class="user-avatar" :class="{'dashed-circle':avaterCpd.isNull}" :style="{backgroundColor:avaterCpd.color}" :src="getHeadimgurl(avaterCpd.userid,avaterCpd.headimgurl)" @error="onImgError(avaterCpd.userid,$event)"></img>
<el-avatar v-else class="field-avater" :class="{'dashed-circle':avaterCpd.isNull}" :icon="avaterCpd.icon" :style="{backgroundColor:avaterCpd.color}">{{avaterCpd.innerText}}</el-avatar>
</div>
</div>
<div class="field-info" :class="{disabled:disabled===true,enabled:disabled!==true}"> <div class="field-info" :class="{disabled:disabled===true,enabled:disabled!==true}">
<slot name="field-info" :value="myVal" > <slot name="field-info" :value="myVal" >
@ -17,19 +23,19 @@
<el-select v-model="myVal" @change="onSelectChange" :clearable="clearable" filterable value-key="userid" @visible-change="$emit('visible-change',$event)" @focus="$emit('focus',$event)" @blur="$emit('blur',$event)" @clear="$emit('blur',$event)" @click="$emit('click',$event)"> <el-select v-model="myVal" @change="onSelectChange" :clearable="clearable" filterable value-key="userid" @visible-change="$emit('visible-change',$event)" @focus="$emit('focus',$event)" @blur="$emit('blur',$event)" @clear="$emit('blur',$event)" @click="$emit('click',$event)">
<el-option :value="myVal" disabled v-if="users && users.length>10"> <el-option :value="myVal" disabled v-if="users && users.length>10">
<el-row><el-button :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''" @click.stop="deptUserVisible=true">部门用户</el-button><el-button v-if="projectId" :type="projectVisible?'primary':''" @click.stop="projectVisible=true">项目组</el-button> </el-row>
<el-row ><el-button v-if="users && users.length>0" :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''" @click.stop="deptUserVisible=true">部门用户</el-button><el-button v-if="projectId" :type="projectVisible?'primary':''" @click.stop="projectVisible=true">项目组</el-button> </el-row>
</el-option> </el-option>
<el-option class="avatar-container" v-for="(item,index) in users" :key="index" :value="item" :label="item.username"> <el-option class="avatar-container" v-for="(item,index) in users" :key="index" :value="item" :label="item.username">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<el-avatar class="user-avatar" :style="{backgroundColor:getMyColor(item)}">{{item.username}}</el-avatar>
<img class="user-avatar" :style="{backgroundColor:getMyColor(item)}" :src="getHeadimgurl(item.userid,item.headimgurl)" @error="onImgError(item.userid,$event)"></img>
<span class="username">{{item.username}}</span> <span class="username">{{item.username}}</span>
<i v-if="myVal && myVal.userid==item.userid" class="el-icon-check"></i> <i v-if="myVal && myVal.userid==item.userid" class="el-icon-check"></i>
<i v-else>&nbsp;&nbsp;</i> <i v-else>&nbsp;&nbsp;</i>
</div> </div>
</el-option> </el-option>
<el-option :value="myVal" disabled> <el-option :value="myVal" disabled>
<el-row><el-button :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''" @click.stop="deptUserVisible=true">部门用户</el-button><el-button v-if="projectId||productId" :type="projectVisible?'primary':''" @click.stop="projectVisible=true">项目组</el-button> </el-row>
<el-row><el-button v-if="users && users.length>0" :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''" @click.stop="deptUserVisible=true">部门用户</el-button><el-button v-if="projectId||productId" :type="projectVisible?'primary':''" @click.stop="projectVisible=true">项目组</el-button> </el-row>
</el-option> </el-option>
</el-select> </el-select>
<slot name="extOper"> <slot name="extOper">
@ -54,15 +60,21 @@
import UsersSelect from '@/views/mdp/sys/user/UsersSelectOnly.vue' import UsersSelect from '@/views/mdp/sys/user/UsersSelectOnly.vue'
import XmGroupSelect from '@/views/xm/core/xmGroup/XmGroupSelect.vue' import XmGroupSelect from '@/views/xm/core/xmGroup/XmGroupSelect.vue'
var us=localStorage.getItem("mdp-his-users") var us=localStorage.getItem("mdp-his-users")
import imtUtil from '@/api/imgUtil';//全局公共库
var users=us?JSON.parse(us):[] var users=us?JSON.parse(us):[]
export default { export default {
name: 'mdp-select-user-xm', name: 'mdp-select-user-xm',
components: { UsersSelect, XmGroupSelect }, components: { UsersSelect, XmGroupSelect },
computed: { computed: {
avaterCpd(){ avaterCpd(){
debugger;
var isEmpty=this.isEmpty(this.myVal) var isEmpty=this.isEmpty(this.myVal)
var username=isEmpty?"":(this.myVal.username?this.myVal.username:this.myVal.userid) var username=isEmpty?"":(this.myVal.username?this.myVal.username:this.myVal.userid)
var obj={isNull:isEmpty,icon:'el-icon-user',color:'#E4E7ED',innerText:username}
var obj={isNull:isEmpty,icon:'el-icon-user',color:'#E4E7ED',innerText:username,userid:'',headimgurl:''}
if(!isEmpty){
obj.headimgurl=this.myVal.headimgurl
obj.userid=this.myVal.userid
}
if(this.getColor||this.color){ if(this.getColor||this.color){
if(this.getColor){ if(this.getColor){
obj.color= this.getColor(this.myVal) obj.color= this.getColor(this.myVal)
@ -75,6 +87,8 @@
obj.color= util.getColor(this.myVal.userid) obj.color= util.getColor(this.myVal.userid)
} }
} }
if(this.getIcon||this.icon){ if(this.getIcon||this.icon){
if(this.getIcon){ if(this.getIcon){
obj.icon= this.getIcon(this.myVal) obj.icon= this.getIcon(this.myVal)
@ -83,12 +97,14 @@
} }
} }
debugger;
return obj; return obj;
} }
}, },
data(){ data(){
return { return {
myVal:{userid:'',username:''},
myVal:{userid:'',username:'',headimgurl:''},
users:[], users:[],
deptUserVisible:false, deptUserVisible:false,
projectVisible:false, projectVisible:false,
@ -161,7 +177,7 @@
}, },
methods: { methods: {
...imtUtil,
isEmpty(v) { isEmpty(v) {
switch (typeof v) { switch (typeof v) {
@ -200,13 +216,15 @@
}, },
initData(){ initData(){
var myVal={}
debugger;
var myVal={userid:'',username:'',headimgurl:''}
if(this.value){ if(this.value){
myVal.userid=this.value[this.useridKey] myVal.userid=this.value[this.useridKey]
myVal.username=this.value[this.usernameKey] myVal.username=this.value[this.usernameKey]
myVal.headimgurl=this.value.headimgurl
this.myVal=myVal this.myVal=myVal
}else{ }else{
this.myVal={userid:'',username:''}
this.myVal=myVal
} }
@ -252,7 +270,7 @@
}, },
mounted(){ mounted(){
this.users=users this.users=users
this.initData();
//this.initData();
} }
} }

2
src/views/xm/core/xmMenu/XmMenuEdit.vue
View File

@ -125,7 +125,7 @@
<mdp-field-x v-model="editForm.finishRate" label="进度"> <mdp-field-x v-model="editForm.finishRate" label="进度">
<div slot="value" style="min-width:150px;"><el-progress :percentage="editForm.finishRate?editForm.finishRate:0"></el-progress> <div slot="value" style="min-width:150px;"><el-progress :percentage="editForm.finishRate?editForm.finishRate:0"></el-progress>
</div> </div>
<div slot="oper"><el-button @click="activateTabPaneName='2'" type="primary">查看工时</el-button><el-button @click="activateTabPaneName='6'" type="primary">查看子工作项</el-button></div>
<div slot="oper"><el-button @click="activateTabPaneName='51'" type="primary">查看工时</el-button><el-button @click="activateTabPaneName='6'" type="primary">查看子工作项</el-button></div>
</mdp-field-x> </mdp-field-x>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">

4
src/views/xm/core/xmTask/XmTaskEdit.vue
View File

@ -144,9 +144,9 @@
<mdp-select-user-xm label="负责人" v-model="editForm" userid-key="createUserid" username-key="createUsername" @change="editXmTaskSomeFields(editForm,'createUserid',$event)"></mdp-select-user-xm> <mdp-select-user-xm label="负责人" v-model="editForm" userid-key="createUserid" username-key="createUsername" @change="editXmTaskSomeFields(editForm,'createUserid',$event)"></mdp-select-user-xm>
</el-col> </el-col>
<el-col :span="8" v-if="editForm.ntype=='0'"> <el-col :span="8" v-if="editForm.ntype=='0'">
<mdp-field-x v-if="editForm.crowd=='1'" label="执行人" v-model="editForm.executorUsername">
<mdp-select-user-xm v-if="editForm.crowd=='1'" label="执行人" v-model="editForm.executorUsername">
<el-button slot="oper" @click="activateTabPaneName='42'">去管理竞标人</el-button> <el-button slot="oper" @click="activateTabPaneName='42'">去管理竞标人</el-button>
</mdp-field-x>
</mdp-select-user-xm>
<mdp-select-user-xm v-if="editForm.crowd!='1'" label="执行人" v-model="editForm" userid-key="executorUserid" username-key="executorUsername" @change="editXmTaskSomeFields(editForm,'executorUserid',$event)"></mdp-select-user-xm> <mdp-select-user-xm v-if="editForm.crowd!='1'" label="执行人" v-model="editForm" userid-key="executorUserid" username-key="executorUsername" @change="editXmTaskSomeFields(editForm,'executorUserid',$event)"></mdp-select-user-xm>
</el-col> </el-col>

Write Preview
Loading…
Cancel
Save