Skip to content

G
gdtel-gztel-school-center-ui
Commit 5b759256 by 吴学德
Options

合伙人页面

parent 304a5891
Showing with 175 additions and 92 deletions
src/views/hhr-view/hhrCustomer.vue
...@@ -39,7 +39,7 @@ ...@@ -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="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 style="height: 250px"></div>
</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="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> <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%;" > <img src="/picture/hhr/service-qrcode.jpg" style="width:55%;" >
...@@ -89,7 +89,10 @@ ...@@ -89,7 +89,10 @@
}, },
packageUpgrade(){ packageUpgrade(){
this.$router.push({path: 'packageUpgrade'}) this.$router.push({path: 'packageUpgrade'})
} },
clickOverlay(){
this.kefushow = false;
}
} }
} }
......
src/views/hhr-view/newpackage/orderNewCar.vue
<template> <template>
<div style="position:fixed"> <div style=" background-image: url('./picture/hhr/01.jpg');
<img src="/picture/hhr/01.jpg" style="width: 100%; float: right"> background-repeat: no-repeat;
<img src="/picture/hhr/kefu.png" style="width: 10%;position:fixed ;right: 5%;top: 3%" @click="showPopup"> background-size: 100%;
<span style="width: 20%;position:fixed ;right: -2%;top: 8%;font-size: 13px">联系客服</span> width: 100%;
<img src="/picture/hhr/question.png" style="width: 10%;position:fixed ;right: 22%;top: 3%"> height: 150%; position:relative">
<span style="width: 20%;position:fixed ;right: 15%;top: 8%;font-size: 13px">常见问题</span> <div style="display: flex; ">
<div style="position:fixed;top: 11%;width: 100%;background-color: white;"> <img src="/picture/hhr/question.png" style="width: 10%;margin-left: 70%;margin-top: 5%">
<div style="padding-left: 12px;padding-top: 20px ;color: black;text-align: left;width: 100%;height: 20%;line-height: 10px"> <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"> <div style="width: 15%;height: 80px;float: left; margin-right: 10px">
<img src="/picture/hhr/sim-bg.png" style="width: 100%;"> <img src="/picture/hhr/sim-bg.png" style="width: 100%;">
</div> </div>
...@@ -15,14 +22,19 @@ ...@@ -15,14 +22,19 @@
<p style="color: red">适用于中小学生,号码卡将统一配送至学生</p> <p style="color: red">适用于中小学生,号码卡将统一配送至学生</p>
<p style="color: red"> 所在学校,由学校发放给学生。</p> <p style="color: red"> 所在学校,由学校发放给学生。</p>
</div> </div>
<h2 style ="font-weight:900" >
请填写有效信息 <div style="border-top:1px solid #e2e2e2; margin-top: 35px">
</h2> <h2 style ="font-weight:900;font-size: 20px;margin-top: -10px;margin-left:10% " >
请填写有效信息
</h2>
</div>
<!-- 领卡表单部分-->
<div>
<van-cell-group> <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="请输入用户名" />
<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 <van-field
left-icon="user-o" left-icon="location-o"
readonly readonly
clickable clickable
name="area" name="area"
...@@ -38,26 +50,62 @@ ...@@ -38,26 +50,62 @@
@cancel="showArea = false" @cancel="showArea = false"
/> />
</van-popup> </van-popup>
<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="user-o" label="学号" v-model="value" placeholder="请输入学生学号" /> <van-field left-icon="contact" label="学号" v-model="value" placeholder="请输入学生学号" />
<van-field left-icon="user-o" label="家长名称" v-model="value" placeholder="请输入家长名称" /> <van-field left-icon="friends-o" label="家长名称" v-model="value" placeholder="请输入家长名称" />
<van-field left-icon="user-o" label="家长身份证" v-model="value" placeholder="请输入家长身份证" /> <van-field left-icon="phone-o" label="家长联系号码" v-model="value" placeholder="请输入家长联系号码" />
<van-field left-icon="user-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> </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 :border="false" :column-num="3">
<van-grid-item @click="tips"> <van-grid-item @click="tips(1)">
<van-image src="/picture/hhr/upload01.png" /> <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 >
<van-grid-item @click="tips"> <van-grid-item @click="tips(2)">
<van-image src="/picture/hhr/upload02.png" /> <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 >
<van-grid-item @click="tips"> <van-grid-item @click="tips(3)">
<van-image src="/picture/hhr/upload03.png" /> <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-item>
</van-grid> </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> </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;">
<div style="border: 1px solid #e2e2e2;width: 92%;height: 90%;position: fixed;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> <div style="font-size: 20px; color: black;text-align: center;position: fixed;top: 3px">您的专属客服</div>
...@@ -65,9 +113,29 @@ ...@@ -65,9 +113,29 @@
</div> </div>
</van-popup> </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> </div>
</template> </template>
...@@ -79,6 +147,7 @@ ...@@ -79,6 +147,7 @@
name: "orderNewCar", name: "orderNewCar",
data(){ data(){
return{ return{
Agree: false,
kefushow:false, kefushow:false,
list:[1,2], list:[1,2],
value: '', value: '',
...@@ -90,46 +159,43 @@ ...@@ -90,46 +159,43 @@
// 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明 // 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明
{ url: 'https://cloud-image', isImage: true } { 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:{ methods:{
fileChange(el){ // 选择文件
if (!el.target.files[0].size) return;//判断是否有文件数量 afterRead(file) {
this.fileListg(el.target.files);//获取files文件组传入处理 let imgurl="img_imgfile"
el.target.value = ''//清空val值，以便可以重复添加一张图片 if (this.uploadstatu==1){
}, this.uploadFileshow.zmian = true
fileListg(files){ imgurl=imgurl+'zmian'
for (let i = 0; i < files.length; i++) {
this.fileAdd(files[i]);
} }
}, if (this.uploadstatu==2){
fileAdd(file){ this.uploadFileshow.fmina= true
this.size = this.size + file.size;//总大小 imgurl=imgurl+'fmina'
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==3){
bytesToSize(bytes){ this.uploadFileshow.txiang = true
if (bytes === 0) return '0 B'; imgurl=imgurl+'txiang'
let k = 1000, // or 1024 }
sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], var img = document.getElementById(imgurl);
i = Math.floor(Math.log(bytes) / Math.log(k)); console.log(img)
return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i]; var reader = new FileReader();
}, reader.onload = function (evt) {
handelup(e) { img.src = evt.target.result;
document.getElementById('upload_file').click() }
}, reader.readAsDataURL(file.file);
// 选择文件
afterRead(e) {
console.log("this.$refs.uploader.onChange")
}, },
showPopup(){ showPopup(){
this.kefushow=true this.kefushow=true
...@@ -138,18 +204,30 @@ ...@@ -138,18 +204,30 @@
this.value = values.map(item => item.name).join('/'); this.value = values.map(item => item.name).join('/');
this.showArea = false; this.showArea = false;
}, },
tips(){ tips(val){
Dialog.setDefaultOptions({ if (val==1){
}) this.sfzshow.zmian=true
Dialog.alert({ this.uploadstatu=1
// title: '证件上传示例', }if (val==2){
message: `<div style="font-weight:1000;font-size:12px"> this.sfzshow.fmina=true
<img src="/picture/hhr/idcard.jpg" style="width:100%;height: 100%" > this.uploadstatu=2
<p >注意照片亮度均匀、图像清晰</p> }
</div>` if (val==3){
}).then(() => { this.sfzshow.txiang=true
// on close 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();
}
} }
} }
} }
......
src/views/hhr-view/packageUpgrade/packageUpgrade.vue
...@@ -37,25 +37,27 @@ ...@@ -37,25 +37,27 @@
<div v-show="duanxing"> <div v-show="duanxing">
<van-popup v-model="duanxing" <van-popup v-model="duanxing"
style="width: 80%;height: 30%; display: flex; align-items: center;justify-content: center;"> 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>
<div style="font-size: 20px; color: black;text-align: center;position: fixed;top: 3px">{{yanzhengma}}</div> <van-field
center
clearable
placeholder="请输入短信验证码"
style="width: 100%;height: 30%;"
>
<van-button slot="button" size="small" type="info"
@click.stop.prevent="getCode"
>{{codeMsg}}
</van-button>
</van-field>
<van-field
center
clearable
placeholder="请输入短信验证码"
style="width: 100%;height: 30%;"
>
<van-button slot="button" size="small" type="info"
@click.stop.prevent="getCode"
>{{codeMsg}}
</van-button>
</van-field>
<van-button round block type="info" native-type="submit">
确认
</van-button>
</div>
<van-button round block type="info" native-type="submit">
确认
</van-button>
</van-popup> </van-popup>
</div> </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