qa-prevention-xgf-vue/static/qrcode/views/electronic_work_card/index.html

123 lines
3.7 KiB
HTML
Raw Normal View History

2023-11-07 10:17:12 +08:00
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>电子工牌</title>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<link rel="stylesheet" type="text/css" href="../../assets/css/weui.css" />
<link rel="stylesheet" type="text/css" href="../../assets/css/weuix.css" />
<link rel="stylesheet" type="text/css" href="../../../bi/css/vant.css" />
<!-- vue -->
<script src="../../../bi/js/vue.js"></script>
<script src="../../../bi/js/vant.min.js"></script>
<!--全局配置-->
<script src="../../../config.js"></script>
</head>
<body style="background-color: #f1f1f1;">
<div id="app" class="dy-card" >
<van-cell-group>
<van-cell title="照片">
<van-image
width="50px"
height="50px"
:src="imgUrl"
@click="fnImagePreview(imgUrl,0)"
></van-image>
</van-cell>
<van-cell title="姓名" :value="pd.NAME"></van-cell>
<van-cell title="性别" :value="gender"></van-cell>
<van-cell title="年龄" :value="pd.AGE"></van-cell>
<van-cell title="所属单位" :value="pd.RELEVANT_UNIT_NAME"></van-cell>
<van-cell title="职务" :value="pd.POST_NAME"></van-cell>
<van-cell title="联系电话" :value="pd.PHONE"></van-cell>
<van-cell title="流动范围" :value="pd.TRAIN_AREA"></van-cell>
</van-cell-group>
<van-image-preview v-model="show" :images="images" :start-position="startPosition">
</van-image-preview>
</div>
<script type="text/javascript" src="../../assets/js/jquery-3.7.1.min.js"></script>
2023-11-07 10:17:12 +08:00
<script type="text/javascript">
var vm = new Vue({
el: '#app',
data:{
USER_ID : '',
pd:{
NAME: '',
SEX: '',
AGE: '',
RELEVANT_UNIT_NAME: '',
POST_NAME: '',
PHONE: '',
TRAIN_AREA: ''
},
show: false,
startPosition: 0,
images: [],
imgUrl: '',
gender: ''
},
methods: {
//初始执行
init() {
this.USER_ID = this.getUrlKey('USER_ID');
this.getData();
},
getData: function(){
var _this = this;
_this.loading = true;
$.ajax({
xhrFields: {
withCredentials: true
},
type: "POST",
url: config.httpurl +'/app/user/getFloatPersonDetailById' ,
dataType: 'json',
data: {
USER_ID: _this.USER_ID,
},
success: function(data){
_this.pd = Object.assign(_this.pd, data.eCard)
if (_this.pd.PHOTO) {
_this.imgUrl = config.fileUrl + _this.pd.PHOTO
} else {
_this.imgUrl = 'https://img01.yzcdn.cn/vant/cat.jpeg'
}
if (_this.pd.SEX == '0') {
_this.gender = '男'
} else if (_this.pd.SEX == '1') {
_this.gender = '女'
}
/* _this.pd.NAME = data.eCard.NAME
_this.pd.SEX = data.eCard.SEX
_this.pd.AGE = data.eCard.AGE
_this.pd.RELEVANT_UNIT_NAME = data.eCard.RELEVANT_UNIT_NAME
_this.pd.POST_NAME = data.eCard.POST_NAME
_this.pd.PHONE = data.eCard.PHONE
_this.pd.TRAIN_AREA = data.eCard.TRAIN_AREA */
}
})
},
//根据url参数名称获取参数值
getUrlKey: function (name) {
return decodeURIComponent(
(new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
},
fnImagePreview(images, startPosition) {
this.images = [images];
this.startPosition = startPosition
this.show = true
},
},
mounted(){
this.init();
}
})
function back(e) {
window.history.go(-1);
}
</script>
</body>
</html>