Commit 5b759256 by 吴学德

合伙人页面

parent 304a5891
......@@ -39,7 +39,7 @@
<div style="background-image: url('./picture/hhr/b2.png');width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;" @click="rongHe"></div>
<div style="height: 250px"></div>
</div>
<van-popup v-model="kefushow" style="width: 90%;height: 45%; display: flex; align-items: center;justify-content: center;">
<van-popup v-model="kefushow" style="width: 90%;height: 45%; display: flex; align-items: center;justify-content: center;" @click-overlay="clickOverlay">
<div style="border: 1px solid #e2e2e2;width: 92%;height: 90%;position: fixed;display: flex; align-items: center;justify-content: center;">
<div style="font-size: 20px; color: black;text-align: center;position: fixed;top: 3px">您的专属客服</div>
<img src="/picture/hhr/service-qrcode.jpg" style="width:55%;" >
......@@ -89,6 +89,9 @@
},
packageUpgrade(){
this.$router.push({path: 'packageUpgrade'})
},
clickOverlay(){
this.kefushow = false;
}
}
}
......
<template>
<div style="position:fixed">
<img src="/picture/hhr/01.jpg" style="width: 100%; float: right">
<img src="/picture/hhr/kefu.png" style="width: 10%;position:fixed ;right: 5%;top: 3%" @click="showPopup">
<span style="width: 20%;position:fixed ;right: -2%;top: 8%;font-size: 13px">联系客服</span>
<img src="/picture/hhr/question.png" style="width: 10%;position:fixed ;right: 22%;top: 3%">
<span style="width: 20%;position:fixed ;right: 15%;top: 8%;font-size: 13px">常见问题</span>
<div style="position:fixed;top: 11%;width: 100%;background-color: white;">
<div style="padding-left: 12px;padding-top: 20px ;color: black;text-align: left;width: 100%;height: 20%;line-height: 10px">
<div style=" background-image: url('./picture/hhr/01.jpg');
background-repeat: no-repeat;
background-size: 100%;
width: 100%;
height: 150%; position:relative">
<div style="display: flex; ">
<img src="/picture/hhr/question.png" style="width: 10%;margin-left: 70%;margin-top: 5%">
<img src="/picture/hhr/kefu.png" style="width: 10%;margin-left: 5%;margin-top: 5%" @click="showPopup">
</div>
<div style="display: flex; ">
<p style="width: 20%;font-size: 13px;margin-left: 65%;">常见问题</p>
<p style="width: 20%;font-size: 13px;">联系客服</p>
</div>
<div style="width: 100%;background-color: white;line-height: 13px;font-size: 13px;">
<div style="padding-top: 5%;padding-left: 5%">
<div style="width: 15%;height: 80px;float: left; margin-right: 10px">
<img src="/picture/hhr/sim-bg.png" style="width: 100%;">
</div>
......@@ -15,14 +22,19 @@
<p style="color: red">适用于中小学生,号码卡将统一配送至学生</p>
<p style="color: red"> 所在学校,由学校发放给学生。</p>
</div>
<h2 style ="font-weight:900" >
<div style="border-top:1px solid #e2e2e2; margin-top: 35px">
<h2 style ="font-weight:900;font-size: 20px;margin-top: -10px;margin-left:10% " >
请填写有效信息
</h2>
</div>
<!-- 领卡表单部分-->
<div>
<van-cell-group>
<van-field left-icon="user-o" label="学生姓名" v-model="value" placeholder="请输入用户名" />
<van-field left-icon="user-o" label="学校" v-model="value" placeholder="请输入9月开学时就读的院校名称" />
<van-field left-icon="location-o" label="学校" v-model="value" placeholder="请输入9月开学时就读的院校名称" />
<van-field
left-icon="user-o"
left-icon="location-o"
readonly
clickable
name="area"
......@@ -38,26 +50,62 @@
@cancel="showArea = false"
/>
</van-popup>
<van-field left-icon="user-o" label="班级" v-model="value" placeholder="请输入学生所属班级" />
<van-field left-icon="user-o" label="学号" v-model="value" placeholder="请输入学生学号" />
<van-field left-icon="user-o" label="家长名称" v-model="value" placeholder="请输入家长名称" />
<van-field left-icon="user-o" label="家长身份证" v-model="value" placeholder="请输入家长身份证" />
<van-field left-icon="user-o" label="备注" v-model="value" placeholder="请输入备注" />
<van-field left-icon="contact" label="班级" v-model="value" placeholder="请输入学生所属班级" />
<van-field left-icon="contact" label="学号" v-model="value" placeholder="请输入学生学号" />
<van-field left-icon="friends-o" label="家长名称" v-model="value" placeholder="请输入家长名称" />
<van-field left-icon="phone-o" label="家长联系号码" v-model="value" placeholder="请输入家长联系号码" />
<van-field left-icon="other-pay" label="家长身份证" v-model="value" placeholder="请输入家长身份证" />
<van-field left-icon="records" label="备注" v-model="value" placeholder="请输入备注" />
</van-cell-group>
<h2 style="margin-top: 20px">请家长持本人以下证件拍照上传,16岁以上学生可学生本人拍照上传</h2>
</div>
<div style="line-height: 20px;margin-left:10%;margin-top: 3%;width: 90%">
<h2 style ="font-weight:900;font-size: 20px;">请家长持本人以下证件拍照上传,16岁以上学生可学生本人拍照上传</h2>
</div>
<p style="color: red;width: 95%;margin: auto;line-height: 18px">根据工信部令第25号规定,用户预受理电信业务需上传身份证国徽照、人像照、半身照三张照片。系统需对您上传的三张照片进行身份证资料核验,成功提交后系统会自动给您发送短信,您可通过短信中的链接查询审核状态,请您耐心等待系统核验结果,谢谢。</p>
<van-grid :border="false" :column-num="3">
<van-grid-item @click="tips">
<van-grid-item @click="tips(1)">
<div v-show="uploadFileshow.zmian">
<img id='img_imgfilezmian' style="width: 80%">
</div>
<div v-show="!uploadFileshow.zmian">
<van-image src="/picture/hhr/upload01.png" />
</div>
</van-grid-item >
<van-grid-item @click="tips">
<van-grid-item @click="tips(2)">
<div v-show="uploadFileshow.fmina">
<img id='img_imgfilefmina' style="width: 80%">
</div>
<div v-show="!uploadFileshow.fmina">
<van-image src="/picture/hhr/upload02.png" />
</div>
</van-grid-item >
<van-grid-item @click="tips">
<van-grid-item @click="tips(3)">
<div v-show="uploadFileshow.txiang">
<img id='img_imgfiletxiang' style="width: 80%">
</div>
<div v-show="!uploadFileshow.txiang">
<van-image src="/picture/hhr/upload03.png" />
</div>
</van-grid-item>
</van-grid>
<div style="height: 130px" >
</div>
</div>
<!-- 领卡确认部分-->
<div style="background-color:white;position: fixed;bottom: 0%">
<div style="margin-left: 8%;font-size: 16px;text-align:left">
<span>
<div style="width: 100%;display: flex;padding-top: 2%">
<van-checkbox v-model="Agree" shape="square" style="width: 10%" checked-color="#07c160">
</van-checkbox>
<span >同意 <a>《中国电信股份有限公司广州分公司全业务服务协议》 </a>内容</span>
</div>
</span>
</div>
<div style="width: 80%;margin-left: 10%;margin-top: 5%;margin-bottom: 2%">
<van-button :round="true" size="large" type="info">马上领卡</van-button>
</div>
</div>
<van-popup v-model="kefushow" style="width: 90%;height: 45%; display: flex; align-items: center;justify-content: center;">
<div style="border: 1px solid #e2e2e2;width: 92%;height: 90%;position: fixed;display: flex; align-items: center;justify-content: center;">
<div style="font-size: 20px; color: black;text-align: center;position: fixed;top: 3px">您的专属客服</div>
......@@ -65,9 +113,29 @@
</div>
</van-popup>
<div>
<van-dialog v-model="sfzshow.zmian" :before-close="closeOnClickOverlay1" :closeOnClickOverlay="true" >
<h2 style="font-weight: 900;text-align: center;margin-top: 5%">证件上传示例</h2>
<img src="/picture/hhr/backidcard.jpg" style="width: 100%">
<p style="text-align: center;">注意照片亮度均匀、图像清晰</p>
</van-dialog>
</div>
<div>
<van-dialog v-model="sfzshow.fmina" :before-close="closeOnClickOverlay1" :closeOnClickOverlay="true">
<h2 style="font-weight: 900;text-align: center;margin-top: 5%">证件上传示例</h2>
<img src="/picture/hhr/backidcard.jpg" style="width: 100%">
<p style="text-align: center;">注意照片亮度均匀、图像清晰</p>
</van-dialog>
</div>
<div>
<van-dialog v-model="sfzshow.txiang" :before-close="closeOnClickOverlay1" :closeOnClickOverlay="true">
<h2 style="font-weight: 900;text-align: center;margin-top: 5%">拍摄正面自拍照</h2>
<p style="color: red;width: 80%;text-align: center;margin-left: 10%">(请打开摄像头拍摄自拍照上传,不要上传证件照)</p>
<img src="/picture/hhr/hand_idcard.png" style="width: 100%">
<p style="text-align: center;">请在光线较好的环境下拍摄,并露出人像五官,面部无遮挡。</p>
</van-dialog>
</div>
<div v-show="false"><van-uploader id="upload_file" :after-read="afterRead" /> </div>
</div>
</template>
......@@ -79,6 +147,7 @@
name: "orderNewCar",
data(){
return{
Agree: false,
kefushow:false,
list:[1,2],
value: '',
......@@ -90,46 +159,43 @@
// 如果图片 URL 中不包含类型信息,可以添加 isImage 标记来声明
{ url: 'https://cloud-image', isImage: true }
],
sfzshow:false
sfzshow:{
zmian:false,
fmina:false,
txiang:false
},
uploadFileshow:{
zmian:false,
fmina:false,
txiang:false
},
uploadstatu:0
}
}
,
methods:{
fileChange(el){
if (!el.target.files[0].size) return;//判断是否有文件数量
this.fileListg(el.target.files);//获取files文件组传入处理
el.target.value = ''//清空val值,以便可以重复添加一张图片
},
fileListg(files){
for (let i = 0; i < files.length; i++) {
this.fileAdd(files[i]);
// 选择文件
afterRead(file) {
let imgurl="img_imgfile"
if (this.uploadstatu==1){
this.uploadFileshow.zmian = true
imgurl=imgurl+'zmian'
}
},
fileAdd(file){
this.size = this.size + file.size;//总大小
let reader = new FileReader();
reader.vue = this;
reader.readAsDataURL(file);
reader.onload = function () {
file.src = this.result;
this.vue.imgList.push({
file
});
if (this.uploadstatu==2){
this.uploadFileshow.fmina= true
imgurl=imgurl+'fmina'
}
},
bytesToSize(bytes){
if (bytes === 0) return '0 B';
let k = 1000, // or 1024
sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
i = Math.floor(Math.log(bytes) / Math.log(k));
return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
},
handelup(e) {
document.getElementById('upload_file').click()
},
// 选择文件
afterRead(e) {
console.log("this.$refs.uploader.onChange")
if (this.uploadstatu==3){
this.uploadFileshow.txiang = true
imgurl=imgurl+'txiang'
}
var img = document.getElementById(imgurl);
console.log(img)
var reader = new FileReader();
reader.onload = function (evt) {
img.src = evt.target.result;
}
reader.readAsDataURL(file.file);
},
showPopup(){
this.kefushow=true
......@@ -138,18 +204,30 @@
this.value = values.map(item => item.name).join('/');
this.showArea = false;
},
tips(){
Dialog.setDefaultOptions({
})
Dialog.alert({
// title: '证件上传示例',
message: `<div style="font-weight:1000;font-size:12px">
<img src="/picture/hhr/idcard.jpg" style="width:100%;height: 100%" >
<p >注意照片亮度均匀、图像清晰</p>
</div>`
}).then(() => {
// on close
});
tips(val){
if (val==1){
this.sfzshow.zmian=true
this.uploadstatu=1
}if (val==2){
this.sfzshow.fmina=true
this.uploadstatu=2
}
if (val==3){
this.sfzshow.txiang=true
this.uploadstatu=3
}
},
closeOnClickOverlay1(val,done){
for (let keyName in this.sfzshow) {
if (this.sfzshow[keyName] == true) {
this.sfzshow[keyName] = false
break
}
}
if (val=='confirm'){
done();
document.getElementById("upload_file").click();
}
}
}
}
......
......@@ -37,7 +37,7 @@
<div v-show="duanxing">
<van-popup v-model="duanxing"
style="width: 80%;height: 30%; display: flex; align-items: center;justify-content: center;">
<div>
<div style="font-size: 20px; color: black;text-align: center;position: fixed;top: 3px">{{yanzhengma}}</div>
<van-field
......@@ -56,6 +56,8 @@
<van-button round block type="info" native-type="submit">
确认
</van-button>
</div>
</van-popup>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment