intellioa
/
super-fusion-platform
mirror of http://10.10.14.221/feiliming/oa-project-vue.git
6
0
Fork 0
Code Issues Projects Releases Wiki Activity

洋浦学校八大中心 德育管理前端

Browse Source
init
gongdi 3 years ago
parent 0e3d61e064
commit 634346af0f
4 changed files with 261 additions and 120 deletions
Show Stats Download Patch File Download Diff File

34
src/views/screenAdaptation/common/portrait.vue
Unescape View File

@ -16,7 +16,7 @@
export default { export default {
data() { data() {
return { return {
imgUrl: this.$store.state.userStore.portraitUrl, imgUrl: ""
} }
}, },
props: ['personId'], props: ['personId'],
@ -24,13 +24,7 @@
if(this.$props.personId !== ""){ if(this.$props.personId !== ""){
this.getImgSrc(this.$props.personId) this.getImgSrc(this.$props.personId)
} }
// if (!this.imgUrl || this.imgUrl === "") {
// this.getImgSrc(this.$props.personId)
// }
}, },
// mounted() {
// this.getImgSrc()
// },
methods: { methods: {
showMessage() { showMessage() {
this.$emit('showMessage') this.$emit('showMessage')
@ -49,36 +43,16 @@
// console.log('获取头像------', result) // console.log('获取头像------', result)
if (result[0].data.file_id !== "") { if (result[0].data.file_id !== "") {
//this.imgUrl = result[0].data.file_id + ',' + result[0].data.extension //this.imgUrl = result[0].data.file_id + ',' + result[0].data.extension
this.imgUrl = StaticParams.getThumbUrl(result[0].data.file_id + "." + result[0].data.extension, 100, 100, 100); let url = StaticParams.getThumbUrl(result[0].data.file_id + "." + result[0].data.extension, 100, 100, 100);
this.imgUrl = url;
} }
}) })
}, },
// getImgSrc: function (personId) {
// if (personId && personId != '') {
// this.InterfaceConfig.callInterface([{
// url: interConfig.getPersonTxByYw.url,
// params: {
// person_id: personId,
// identity_id: 5,
// },
// method: interConfig.getPersonTxByYw.method,
// isTestLogin: interConfig.getPersonTxByYw.isTestLogin,
// }], (result) => {
// let resData = result[0].data;
// if (result[0].status === 200) {
// if (resData.success === true) {
// this.imgUrl = StaticParams.getThumbUrl(resData.file_id + "." + resData.extension, 100, 100, 100);
// this.$store.commit('userStore/setPortraitUrl', this.imgUrl);
// }
// }
// })
// }
// }
}, },
watch: { watch: {
personId: function (newVal) { personId: function (newVal) {
this.getImgSrc(newVal) this.getImgSrc(newVal)
} },
}, },
components: { components: {
AAvatar: Avatar AAvatar: Avatar

76
src/views/screenAdaptation/common/topPortrait.vue
Unescape View File

@ -0,0 +1,76 @@
<template>
<div class="portrait-style">
<a-avatar slot="avatar" :src="imgUrl" @click="showMessage"></a-avatar>
</div>
</template>
<script>
/**
* 导航头像组件
* src
*/
import interConfig from '../api/commonInter.js';
import {Avatar} from 'ant-design-vue';
import BaseConfig from '../../../global-llibs/base-config'
import StaticParams from '../../../global-llibs/staticParams';
export default {
data() {
return {
imgUrl: this.$store.state.userStore.portraitUrl,
}
},
props: ['personId'],
created() {
if(this.$props.personId !== ""){
this.getImgSrc(this.$props.personId)
}
},
methods: {
showMessage() {
this.$emit('showMessage')
},
getImgSrc(personId) {
let param = {
person_id: personId,
identity_id: 5
}
this.InterfaceConfig.callInterface([{
url: interConfig.getPersonTxBy.url,
params: param,
method: interConfig.getPersonTxBy.method,
isTestLogin: interConfig.getPersonTxBy.isTestLogin,
}], (result) => {
// console.log('获取头像------', result)
if (result[0].data.file_id !== "") {
//this.imgUrl = result[0].data.file_id + ',' + result[0].data.extension
let url = StaticParams.getThumbUrl(result[0].data.file_id + "." + result[0].data.extension, 100, 100, 100);
this.imgUrl = url;
}
})
},
},
watch: {
personId: function (newVal) {
this.getImgSrc(newVal)
},
'$store.state.userStore.portraitUrl': function (newVal,oldVal) {
this.imgUrl = newVal;
},
},
components: {
AAvatar: Avatar
}
}
</script>
<style scoped lang="scss">
.portrait-style {
display: flex;
justify-content: center;
align-items: center;
/*cursor:pointer;*/
.ant-avatar {
width: 32px;
height: 32px;
}
}
</style>

2
src/views/screenAdaptation/pages/homePages/menuTop/personInfo.vue
Unescape View File

@ -19,7 +19,7 @@
</div> </div>
</template> </template>
<script> <script>
import Portrait from '../../../common/portrait.vue'; import Portrait from '../../../common/topPortrait.vue';
import {Icon} from 'ant-design-vue'; import {Icon} from 'ant-design-vue';
import PersonMsgModal from './personMsgModal'; import PersonMsgModal from './personMsgModal';
import interfaceConfig from '../../../../../global-llibs/axios-config' import interfaceConfig from '../../../../../global-llibs/axios-config'

269
src/views/screenAdaptation/pages/homePages/menuTop/personMsgModal.vue
Unescape View File

@ -27,27 +27,40 @@
<a-col :span="12" offset="1" class="perMsg colRight"> <a-col :span="12" offset="1" class="perMsg colRight">
<div class="colRightTbox"> <div class="colRightTbox">
<div class="titleLogo">头像信息</div> <div class="titleLogo">头像信息</div>
<a-row class="leftPic"> <!--<a-row class="leftPic">-->
<a-col :span="12" class="mypicture"> <!--<a-col :span="12" class="mypicture">-->
<img :src="imgSrc" alt="" <!--<img :src="imgSrc" alt=""-->
style="display:inline-block;width: 100%;height: 100%;" <!--style="display:inline-block;width: 100%;height: 100%;"-->
ref="imgChange"> <!--ref="imgChange">-->
</a-col> <!--</a-col>-->
<a-col :span="12" class="editIcon"> <!--<a-col :span="12" class="editIcon">-->
<img src="./images/rotate-left.png" alt="" @click="rotateLeftFn(0)"> <!--<img src="./images/rotate-left.png" alt="" @click="rotateLeftFn(0)">-->
<img src="./images/rotate-right.png" alt="" @click="rotateLeftFn(1)"> <!--<img src="./images/rotate-right.png" alt="" @click="rotateLeftFn(1)">-->
<img src="./images/search-plus.png" alt="" @click="searchPlusFn(0)"> <!--<img src="./images/search-plus.png" alt="" @click="searchPlusFn(0)">-->
<img src="./images/search-minus.png" alt="" @click="searchPlusFn(1)"> <!--<img src="./images/search-minus.png" alt="" @click="searchPlusFn(1)">-->
</a-col> <!--</a-col>-->
</a-row> <!--</a-row>-->
<div class="rightText"> <div class="colRightBbox_content">
<a-upload maxCount="1" accept=".jpg,.jpeg,.png,.bmp" list-type="picture" <div class="mypicture">
v-model:file-list="fileListPic" <img ref="modifyPhoto" alt=""
class="fixBtnChange" @change="setPersonTx">更换图片 :src="txPhotoUrl"
</a-upload> style="display:inline-block;width: 100%;height: 100%;">
<a-button class="fixBtnSave" type="primary" @click="saveTx">保存头像</a-button> </div>
<span>仅支持.jpg.jpeg.png.bmp图片格式</span> <div class="fixBtn">
<a-button class="fixBtnChange" type="primary" @click="onShowCropper(1)">上传头像</a-button>
<br>
<a-button class="fixBtnSave" type="primary" @click="saveTxPhoto">保存头像</a-button>
</div>
</div> </div>
<!--<div class="rightText">-->
<!--<a-upload maxCount="1" accept=".jpg,.jpeg,.png,.bmp" list-type="picture"-->
<!--v-model:file-list="fileListPic"-->
<!--class="fixBtnChange" @change="setPersonTx">更换图片-->
<!--</a-upload>-->
<!--<a-button class="fixBtnSave" type="primary" @click="saveTx">保存头像</a-button>-->
<!--<span>仅支持.jpg.jpeg.png.bmp图片格式</span>-->
<!--</div>-->
</div> </div>
<div class="colRightBbox"> <div class="colRightBbox">
<div class="titleLogo">证件照信息</div> <div class="titleLogo">证件照信息</div>
@ -58,7 +71,7 @@
style="display:inline-block;width: 100%;height: 100%;"> style="display:inline-block;width: 100%;height: 100%;">
</div> </div>
<div class="fixBtn"> <div class="fixBtn">
<a-button class="fixBtnChange" type="primary" @click="onShowCropper">修改证件照</a-button> <a-button class="fixBtnChange" type="primary" @click="onShowCropper(0)">修改证件照</a-button>
<br> <br>
<a-button class="fixBtnSave" type="primary" @click="saveIdPhoto">保存证件照</a-button> <a-button class="fixBtnSave" type="primary" @click="saveIdPhoto">保存证件照</a-button>
</div> </div>
@ -67,10 +80,10 @@
</a-col> </a-col>
</a-row> </a-row>
</a-modal> </a-modal>
<modal-panel addChildType="slot" modalTitle="上传证件照" :show="show" modalWidth="60%" <modal-panel addChildType="slot" :modalTitle="photoType === 0?'上传证件照':'上传头像'" :show="show" modalWidth="60%"
class="person-id-photo-container" class="person-id-photo-container"
:destroyOnClose="destroyOnClose" @callback="onCallback"> :destroyOnClose="destroyOnClose" @callback="onCallback">
<img-cropper selectBtnName="选择证件照" :option="option" ref="cropper" :cropperName="photoTitle" <img-cropper selectBtnName="选择照片" :option="option" ref="cropper" :cropperName="photoTitle"
:can-upload="false"/> :can-upload="false"/>
</modal-panel> </modal-panel>
</div> </div>
@ -92,6 +105,7 @@
props: ['login_name', 'person_name', 'identity', 'bureau_name', 'district_name', 'id_number', 'TEL', 'visible'], props: ['login_name', 'person_name', 'identity', 'bureau_name', 'district_name', 'id_number', 'TEL', 'visible'],
data() { data() {
return { return {
photoType:0,//0 证件照 1 头像
destroyOnClose: false, destroyOnClose: false,
show: false, show: false,
photoTitle: "", photoTitle: "",
@ -121,13 +135,19 @@
modifyPhotoObj: {}, modifyPhotoObj: {},
idPhotoJson: {}, idPhotoJson: {},
idPhotoUrl: '', idPhotoUrl: '',
fileSize: "" txPhotoUrl:'',
fileSize: "",
idFileId:"",
idExtension:"",
txFileId:"",
txExtension:""
} }
}, },
watch: { watch: {
visible(newVal) { visible(newVal) {
if (newVal) { if (newVal) {
this.getModifyPhoto() this.getModifyPhoto()
this.getPersonTx()
} }
}, },
}, },
@ -151,7 +171,13 @@
this.getPersonTx() this.getPersonTx()
}, },
methods: { methods: {
onShowCropper: function () { onShowCropper: function (type) {
if(type === 0){
this.option.img = this.idPhotoUrl;
}else {
this.option.img = this.txPhotoUrl;
}
this.photoType = type;
this.show = true; this.show = true;
}, },
onCallback: function ([type]) { onCallback: function ([type]) {
@ -165,8 +191,17 @@
if (this.$refs.cropper.file) { if (this.$refs.cropper.file) {
StaticParams.uploadFile(file, (data) => { StaticParams.uploadFile(file, (data) => {
if (data.success === true) { if (data.success === true) {
this.idPhotoUrl = this.BaseConfig.url_path_down + data.data.data.url; if(this.photoType === 0){
this.fileSize = data.data.data.file_size; this.idFileId = data.data.data.file_id;
this.idExtension = data.data.data.extension;
let url = BaseConfig.url_path_suffix + this.idFileId.substring(0, 2) + "/" + this.idFileId + "." + this.idExtension;
this.idPhotoUrl = this.BaseConfig.url_path_down + url;
}else{
this.txFileId = data.data.data.file_id;
this.txExtension = data.data.data.extension;
let url = BaseConfig.url_path_suffix + this.txFileId.substring(0, 2) + "/" + this.txFileId + "." + this.txExtension;
this.txPhotoUrl = this.BaseConfig.url_path_down + url;
}
} }
}, false)//不插入资源库 }, false)//不插入资源库
} }
@ -228,9 +263,11 @@
if (res.code === 2000) { if (res.code === 2000) {
let file = res.data.id_photo_json; let file = res.data.id_photo_json;
if (file && file !== "") { if (file && file !== "") {
this.idPhotoUrl = JSON.parse(file).url; this.idFileId = JSON.parse(file).fileId;
this.fileSize = JSON.parse(file).file_size; this.idExtension = JSON.parse(file).extension;
this.option.img = this.idPhotoUrl; let url = BaseConfig.url_path_suffix + this.idFileId.substring(0, 2) + "/" + this.idFileId + "." + this.idExtension;
this.idPhotoUrl = this.BaseConfig.url_path_down + url;
// this.option.img = this.idPhotoUrl;
} }
} }
}) })
@ -242,8 +279,8 @@
identity_id: this.BaseConfig.userInfo.identity_id,//"登录人身份ID identity_id: this.BaseConfig.userInfo.identity_id,//"登录人身份ID
org_id: this.BaseConfig.person_info_my.bureau_id, //登录人机构ID org_id: this.BaseConfig.person_info_my.bureau_id, //登录人机构ID
id_photo_json: JSON.stringify({ id_photo_json: JSON.stringify({
file_size: this.fileSize, extension: this.idExtension,
url: this.idPhotoUrl fileId: this.idFileId
}), }),
} }
this.InterfaceConfig.callInterface([{ this.InterfaceConfig.callInterface([{
@ -259,50 +296,53 @@
} }
}) })
}, },
//获取头像信息 //保存头像
getPersonTx() { saveTxPhoto: function () {
let param = { let param = {
person_id: BaseConfig.userInfo.person_id_cookie, person_id: BaseConfig.userInfo.person_id_cookie,
identity_id: BaseConfig.userInfo.identity_id_cookie identity_id: BaseConfig.userInfo.identity_id_cookie,
file_id: this.txFileId,
extension: this.txExtension
} }
this.InterfaceConfig.callInterface([{ this.InterfaceConfig.callInterface([{
url: InterConfig.getPersonTxByYw.url, url: InterConfig.setPersonTxByYw.url,
params: param, params: param,
method: InterConfig.getPersonTxByYw.method, method: InterConfig.setPersonTxByYw.method,
isTestLogin: InterConfig.getPersonTxByYw.isTestLogin, isTestLogin: InterConfig.setPersonTxByYw.isTestLogin,
}], (result) => { }], (result) => {
//console.log('获取头像', result) if (result[0].data.success === true) {
if (result[0].data.file_id !== "") { message.success('修改成功')
this.imgSrc = result[0].data.file_id + ',' + result[0].data.extension this.getPersonTx();
} else {
message.error('修改失败')
} }
}) })
}, },
//更换头像 //获取头像信息
setPersonTx(val) { getPersonTx() {
let targetUrl = val.fileList[val.fileList.length - 1]
this.$refs.imgChange.src = targetUrl.thumbUrl
},
//保存头像
saveTx() {
let param = { let param = {
person_id: BaseConfig.userInfo.person_id_cookie, person_id: BaseConfig.userInfo.person_id_cookie,
identity_id: BaseConfig.userInfo.identity_id_cookie, identity_id: BaseConfig.userInfo.identity_id_cookie
file_id: this.$refs.imgChange.src,
extension: 'png',
} }
this.InterfaceConfig.callInterface([{ this.InterfaceConfig.callInterface([{
url: InterConfig.setPersonTxByYw.url, url: InterConfig.getPersonTxByYw.url,
params: param, params: param,
method: InterConfig.setPersonTxByYw.method, method: InterConfig.getPersonTxByYw.method,
isTestLogin: InterConfig.setPersonTxByYw.isTestLogin, isTestLogin: InterConfig.getPersonTxByYw.isTestLogin,
}], (result) => { }], (result) => {
if (!result[0].data.success) { let res = result[0]
message.error('保存失败') if(res.status === 200){
} else { let obj = res.data;
message.success('保存成功') if(obj.file_id && obj.file_id !== ""){
this.txFileId = obj.file_id;
this.txExtension = obj.extension;
let url = BaseConfig.url_path_suffix + this.txFileId.substring(0, 2) + "/" + this.txFileId + "." + this.txExtension;
this.txPhotoUrl = this.BaseConfig.url_path_down + url;
this.$store.commit('userStore/setPortraitUrl', this.txPhotoUrl);
}
} }
}) })
} },
} }
} }
</script> </script>
@ -490,9 +530,55 @@
position: relative; position: relative;
border: 1px dashed #03EFFD; border: 1px dashed #03EFFD;
height: calc(50% - 8px); height: calc(50% - 8px);
margin-bottom: 16px;
border-radius: 8px; border-radius: 8px;
display: flex; .colRightBbox_content {
width: 100%;
height: 100%;
display: flex;
justify-content: space-around;
align-items: center;
.fixBtn {
width: 150px;
}
.mypicture {
width: 110px;
height: 110px;
/*margin-top: 32px;*/
/*margin-left: 50px;*/
border-radius: 50%;
border: 1px solid #03EFFD;
overflow: hidden;
.upload-container-style {
width: 100%;
height: 100%;
.img-style {
width: 100%;
height: 100%;
}
}
}
.fixBtnChange, .fixBtnSave {
/*position: absolute;*/
width: 120px;
height: 39px;
line-height: 39px;
/*top: 21%;*/
background: none;
/*right: 65px;*/
display: block;
border: 1px solid #03EFFD;
border-radius: 5px;
cursor: pointer;
text-align: center;
}
.fixBtnSave {
/*top: 51%;*/
background: none;
}
.save-button {
margin-top: 50px;
}
}
.leftPic { .leftPic {
width: 42%; width: 42%;
display: flex; display: flex;
@ -525,40 +611,13 @@
} }
} }
} }
.rightText {
width: 50%;
display: flex;
justify-content: center;
align-items: flex-end;
flex-wrap: wrap;
.fixBtnChange, .fixBtnSave {
width: 120px;
height: 39px;
line-height: 39px;
display: block;
border: 1px solid #03EFFD;
border-radius: 5px;
cursor: pointer;
}
.fixBtnSave {
background: none;
span {
right: 30px;
bottom: 0;
}
}
span {
display: block;
}
}
} }
.colRightBbox { .colRightBbox {
position: relative; position: relative;
border: 1px dashed #03EFFD; border: 1px dashed #03EFFD;
height: calc(50% - 8px); height: calc(50% - 8px);
border-radius: 8px; border-radius: 8px;
margin-top: 16px;
.colRightBbox_content { .colRightBbox_content {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -607,6 +666,38 @@
margin-top: 50px; margin-top: 50px;
} }
} }
.leftPic {
width: 42%;
display: flex;
height: auto;
justify-content: center;
flex-wrap: wrap;
.mypicture {
width: 110px;
height: 110px;
margin-top: 20px;
border-radius: 50%;
border: 1px solid #03EFFD;
overflow: hidden;
.upload-container-style {
width: 100%;
height: 100%;
}
}
.editIcon {
width: 110px;
height: 30px;
margin-top: 9px;
display: flex;
justify-content: space-between;
img {
width: 24px;
height: 24px;
cursor: pointer;
}
}
}
} }
} }
} }

Write Preview
Loading…
Cancel
Save