Commit bbdd844c authored by zhengke's avatar zhengke

意见调查表

parent 2cca3d01
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<meta name="screen-orientation"content="portrait"></meta>
<meta name="x5-orientation"content="portrait"></meta>
<link rel="shortcut icon" href="../../images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../../css/cssReset.css">
<link rel="stylesheet" href="../../css/bts/bootstrap.min.css">
<title>手机号验证</title>
</head>
<body>
<div class="MobileVerification-box">
<div class="MobileVerification">
<span class="name"></span>
<span class="phone"></span>
<div>
<button onclick="gourl()">立即填写</button>
</div>
</div>
</div>
<script src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/autosize.js"></script>
<script type="text/javascript" src="../../js/jquery-1.10.2.js"></script>
<script src="../../js/layer/layer.js"></script>
<script src="../../js/mian.js"></script>
<script>
var datas = query()
$('.name').html(decodeURIComponent(datas.SurName))
$('.phone').html(hidePhoneNumber(datas.phone))
function hidePhoneNumber(phoneNumber) {
return phoneNumber.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
}
function gourl() {
window.location.href='guestSign.html?TCID='+datas.TCID+'&GuestId='+datas.GuestId+'&SurName='+datas.SurName+'&Sex='+datas.Sex+'&OrderId='+datas.OrderId+'&phone='+datas.phone
}
</script>
</body>
<style>
.MobileVerification-box{
display: flex;
align-items: center;
justify-content: center;
}
.MobileVerification{
width:90%;
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 20px 0 10px 0;
border-bottom: 1px solid #D3D3D3;
}
.MobileVerification button{
border: 0;
background-color: #5A99FF;
border-radius: 3px;
padding: 2px 10px;
color: #fff;
}
</style>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<meta name="screen-orientation"content="portrait"></meta>
<meta name="x5-orientation"content="portrait"></meta>
<link rel="shortcut icon" href="../../images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../../css/cssReset.css">
<link rel="stylesheet" href="../../css/bts/bootstrap.min.css">
<title>填写意见</title>
</head>
<body>
<!-- <div class="BackBox">
<img class="BackImg" onclick="goBack()" src="../../images/login/login_arrowleft.png" />
</div> -->
<div class="FillincommentsF">
<div class="FillincommentsBox" id="FillincommentsBox">
<h3 class="headerTitle"></h3>
<h5 class="subscript" id="subscript"></h5>
<div class="FillincommentsIn">
<div class="FillincommentsInLD">
<div><span>领队:</span><span class="lindui"></span></div>
<div><span>导游:</span><span class="daoyou"></span></div>
</div>
<div class="FillincommentsInT">
<div><span>团期:</span><span class="tuanqi1"></span></div>
</div>
</div>
<div class="FillincommentsMarkB" id="app">
<!-- <div class="FillincommentsMark">
<div class="FillincommentsMarkT">
<span class="xuhao">1、</span>
<span class="title">行程安排</span>
</div>
<div class="FillincommentsSingle">
<input type="radio" value=""><span>否</span></input>
<input type="radio" value=""><span>是</span></input>
</div>
<div class="FillincommentsMultiple">
<input type="checkbox" name="否"><span>否</span></input>
<input type="checkbox" name="是"><span>是</span></input>
</div>
<div class="FillincommentsDescription">
<input type="text" placeholder="点击输入" maxlength="20"></input>
</div>
</div> -->
</div>
<div class="submitBForm">
<button onclick="saveGuestSurvey()" class="submitB" id="submitB">确认</button>
</div>
</div>
</div>
<script src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/autosize.js"></script>
<script type="text/javascript" src="../../js/jquery-1.10.2.js"></script>
<script src="../../js/layer/layer.js"></script>
<script src="../../js/mian.js"></script>
<script>
var qMsg = query()
var priceInfo = null
var dataList = null
var GuestSurveyInfo = null
var texts = [
'非常不满意',
'不满意',
'感觉一般',
'满意',
'非常满意'
]
var STAR_IMG = new Array("../../images/Star1.png", "../../images/Star2.png");
getPriceInfo()
GetSurveyShowList()
getRadio()
getCheckbox()
GetBusSurveyInfo()
function clickRadio(i) {
const Radiobox = document.getElementById(`my_Radio${i}`);
Radiobox.click()
}
function getRadio() {
dataList.forEach((x,i)=>{
x.SurveyOptionsList.forEach((y,index)=>{
const radios = document.getElementsByName(`my_Radio${i+1}`);
radios.forEach(radio => {
radio.addEventListener('click', function() {
x.ScoreNum = radio.value
// 当单选按钮被点击时,输出它的值
// console.log('Selected value:', radio.value);
});
});
})
})
}
function clickCheckbox(i) {
const checkbox = document.getElementById(`my_checkbox${i}`);
checkbox.click()
}
function getCheckbox() {
dataList.forEach((x,i)=>{
x.SurveyOptionsList.forEach((y,index)=>{
const checkbox = document.getElementsByName(`my_checkbox${i+1}`);
checkbox.forEach(checkbox => {
checkbox.addEventListener('click', function() {
if(checkbox.checked) y.IsCheckS.push(checkbox.value)
if(!checkbox.checked) y.IsCheckS = y.IsCheckS.filter(z=>{return z!=checkbox.value})
// console.log(y.IsCheckS,'-----------')
});
});
})
})
}
function getTextarea() {
dataList.forEach((x,i)=>{
var word = document.getElementById(`my_textarea${i+1}`)
if(word&&word.value){
x.TextContent = word.value
}
})
}
function saveGuestSurvey() {
getTextarea()
$('#submitB').attr('disabled', true)
var postMsg = [];
if (dataList && dataList.length > 0) {
dataList.forEach(item => {
item.TCID = qMsg.TCID;
if (item.SurveyType === 2 || item.SurveyType === 3) {
item.SurveyOptionsList.forEach(y => {
//单选
if (item.SurveyType == 2) {
if (item.ScoreNum == y.ID) {
y.IsCheck = "1";
}
}
//多选
if (item.SurveyType == 3) {
y.IsCheck = "0";
if (y.IsCheckS) {
y.IsCheck = "1";
}
}
})
item.ScoreNum = 0;
}
postMsg.push(item);
})
}
var newMsg = {
busDetailsList: postMsg
}
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_SetBusSurvey", newMsg),
async: false,
success: function (res) {
if (res.resultCode === 1) {
layer.msg(res.message)
} else {
layer.msg(res.message)
}
$('#submitB').attr('disabled', false)
},
error: function (message) {
$('#submitB').attr('disabled', false)
alert(JSON.stringify(message));
}
});
}
function GetBusSurveyInfo() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_GetGuestSurveyInfo", {
IsShow: 1,
SurveyType: -1
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
GuestSurveyInfo = res.data
if(GuestSurveyInfo.Title)$('.headerTitle').html(GuestSurveyInfo.Title)
if(GuestSurveyInfo.SubTitle) $('.subscript').html(GuestSurveyInfo.SubTitle)
else{
let parent = document.getElementById("FillincommentsBox");
let child = document.getElementById("subscript");
parent.removeChild(child);
}
}else{
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function GetSurveyShowList() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_GetBusSurveyShowList", {
IsShow: 1,
SurveyType: -1
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
let data = res.data
data.map(item => {
if (item.SurveyType === 2) {
item.SurveyOptionsList.map((cItem, cIndex) => {
cItem.IsCheckS = false
})
}
if (item.SurveyType === 3) {
item.SurveyOptionsList.map((cItem, cIndex) => {
cItem.IsCheckS = []
})
}
if (item.SurveyType === 1) {
item.ScoreNum = 5;
}
})
dataList = data
renderStar()
} else {
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function getPriceInfo() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("miniProgram_post_GetBasePrice", {
tcid: this.qMsg.TCID
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
let data = res.data
priceInfo = data
if(priceInfo&&priceInfo.LeaderName&&priceInfo.LeaderName!='') $('.lindui').html(priceInfo.LeaderName)
if(priceInfo&&priceInfo.GuideName&&priceInfo.GuideName!='') $('.daoyou').html(priceInfo.GuideName)
if(priceInfo&&priceInfo.StartDateStr&&priceInfo.StartDateStr!='') $('.tuanqi1').html(priceInfo.StartDateStr)
if(priceInfo&&priceInfo.EndDateStr&&priceInfo.EndDateStr!='') $('.tuanqi2').html(priceInfo.EndDateStr)
} else {
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function chgStar(num,index){
dataList[index].ScoreNum = num
renderStar()
}
function renderStar(){
// return
var list = []
dataList.forEach((item,i) => {
var str = ''
var mark = ''
var singleChoice = ''
var MultipleChoice = ''
var inputText = ''
var end = `</div>`
var element = document.createElement('div');
str = `<div class="FillincommentsMark">
<div class="FillincommentsMarkT">
<span class="xuhao">${i+1}、</span>
<span class="title">${item.Title}</span>
</div>`
if(item.SurveyType==1) mark = `<div class="FillincommentsMarks">
<span class="text">评 分</span>
<div class="pinfen" id="star${i+1}">
<img id="star_1id_${i+1}point" onmouseover="chgStar(1,${i})"
src="${item.ScoreNum>=1?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_2id_${i+1}point" onmouseover="chgStar(2,${i})"
src="${item.ScoreNum>=2?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_3id_${i+1}point" onmouseover="chgStar(3,${i})"
src="${item.ScoreNum>=3?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_4id_${i+1}point" onmouseover="chgStar(4,${i})"
src="${item.ScoreNum>=4?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_5id_${i+1}point" onmouseover="chgStar(5,${i})"
src="${item.ScoreNum>=5?STAR_IMG[0]:STAR_IMG[1]}"></img>
</div>
<span class="manyidu">${item.ScoreNum==1?texts[0]:item.ScoreNum==2?texts[1]:item.ScoreNum==3?texts[2]:item.ScoreNum==4?texts[3]:item.ScoreNum==5?texts[4]:''}</span>
</div>`
if(item.SurveyType==2) {
let radioList = []
if(item.SurveyOptionsList.length>0)item.SurveyOptionsList.forEach((radio,index)=>{
radioList.push(`<div><input type="radio" value="${radio.ID}" name="my_Radio${i+1}" id="my_Radio${i+1}${index+1}"/><span onclick="clickRadio(${i+1}${index+1})">${radio.OptionsName}</span></div>`)
})
if(radioList.length>0) singleChoice = `<div class="FillincommentsSingle">
${radioList}
</div>`
}
if(item.SurveyType==3) {
let MultipleList = []
if(item.SurveyOptionsList.length>0)item.SurveyOptionsList.forEach((radio,index)=>{
MultipleList.push(`<div><input type="checkbox" value="${radio.ID}" name="my_checkbox${i+1}" id="my_checkbox${i+1}${index+1}"/><span onclick="clickCheckbox(${i+1}${index+1})">${radio.OptionsName}</span></div>`)
})
if(MultipleList.length>0) MultipleChoice = `<div class="FillincommentsMultiple">
${MultipleList}
</div>`
}
if(item.SurveyType==4) {
inputText = `<div class="FillincommentsDescription">
<textarea rows="8" cols="30" placeholder="点击输入" maxlength="500" id="my_textarea${i+1}" onblur="getTextarea()"></textarea>
</div>`
}
var textHtml = str+mark+singleChoice+MultipleChoice+inputText+end
element.innerHTML = textHtml
list.push(element)
})
$("#app").html(list)
}
</script>
</body>
<style>
.BackBox{
position: fixed;
left: 0px;
top: 0px;
right: 0;
background: #fff;
padding: 20px 20px 10px 20px;
z-index: 2;
}
.BackImg{
width: 10px;
}
.FillincommentsF{
display: flex;
align-items: center;
justify-content: center;
height:100%;
overflow-y: auto;
}
.FillincommentsBox{
width: 90%;
height: 100%;
display: flex;
flex-direction: column;
}
.FillincommentsBox H3{
margin-top: 20px;
}
.FillincommentsIn{
background: #F6F6F6;
border-radius: 5px;
padding: 10px;
margin-top: 10px;
}
.FillincommentsInLD{
display: flex;
flex-direction: row;
justify-content: space-between;
}
.FillincommentsInLD div{
flex: 1;
flex-shrink: 0;
}
.FillincommentsInT{
padding-top: 5px;
}
.FillincommentsMarkB{
display: flex;
flex-direction: column;
flex: 1;
/* overflow: hidden;
overflow-y: auto; */
padding-bottom: 20px;
}
.FillincommentsMark{
display: flex;
flex-direction: column;
margin-top: 15px;
}
.FillincommentsMarkT{
display: flex;
flex-direction: row;
font-size: 15px;
font-weight: 500;
}
.FillincommentsMarks{
font-size: 14px;
font-weight: 500;
margin-top: 5px;
display: flex;
flex-direction: row;
}
.FillincommentsMarks span{
position: relative;
top: 3px;
}
.text{
width: 50px;
flex-shrink: 0;
}
.manyidu{
width: auto;
flex-shrink: 0;
margin-left: 10px;
}
.submitBForm{
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 15px;
}
.submitB{
width: 90%;
border: 0;
height: 40px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
background-color: #EE4554;
color: #fff;
}
.pinfen img {
width: 20px;
height: 20px;
display: inline-block;
}
.FillincommentsSingle{
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
margin-top: 5px;
}
.FillincommentsSingle span{
position: relative;
top: 1px;
left: 5px;
}
.FillincommentsSingle div{
display: flex;
flex-direction: row;
align-items: self-start;
justify-content: center;
flex-wrap: nowrap;
margin-right: 20px;
margin-bottom: 5px;
}
.FillincommentsMultiple {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
margin-top: 5px;
}
.FillincommentsMultiple span{
position: relative;
top: 0px;
left: 5px;
}
.FillincommentsMultiple div{
display: flex;
flex-direction: row;
align-items: self-start;
justify-content: center;
flex-wrap: nowrap;
margin-right: 20px;
margin-bottom: 5px;
}
.FillincommentsDescription{
margin-top: 10px;
background: #F6F6F6;
}
.FillincommentsDescription textarea{
width: 100%;
/* height: 150px; */
padding: 5px 10px;
background: #F6F6F6;
border: 1px solid #F6F6F6;
}
.FillincommentsDescription textarea:focus{
border: 1px solid #76c9fa; /* 当textarea获取焦点时的边框色 */
outline: none;
}
.subscript,.ganxiecydc{
/* margin-top: 0;
margin-bottom: 0; */
}
</style>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<meta name="screen-orientation"content="portrait"></meta>
<meta name="x5-orientation"content="portrait"></meta>
<link rel="shortcut icon" href="../../images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../../css/cssReset.css">
<link rel="stylesheet" href="../../css/bts/bootstrap.min.css">
<title>填写意见</title>
</head>
<body>
<!-- <div class="BackBox">
<img class="BackImg" onclick="goBack()" src="../../images/login/login_arrowleft.png" />
</div> -->
<div class="FillincommentsF">
<div class="FillincommentsBox" id="FillincommentsBox">
<h3 class="headerTitle"></h3>
<h5 class="subscript" id="subscript"></h5>
<h4 class="ganxiecydc"></h4>
<div class="FillincommentsIn">
<div class="FillincommentsInLD">
<div><span>领队:</span><span class="lindui"></span></div>
<div><span>导游:</span><span class="daoyou"></span></div>
</div>
<div class="FillincommentsInT">
<div><span>团期:</span><span class="tuanqi1"></span></div>
</div>
</div>
<div class="FillincommentsMarkB" id="app">
<!-- <div class="FillincommentsMark">
<div class="FillincommentsMarkT">
<span class="xuhao">1、</span>
<span class="title">行程安排</span>
</div>
<div class="FillincommentsSingle">
<input type="radio" value=""><span>否</span></input>
<input type="radio" value=""><span>是</span></input>
</div>
<div class="FillincommentsMultiple">
<input type="checkbox" name="否"><span>否</span></input>
<input type="checkbox" name="是"><span>是</span></input>
</div>
<div class="FillincommentsDescription">
<input type="text" placeholder="点击输入" maxlength="20"></input>
</div>
</div> -->
</div>
<div class="submitBForm">
<button onclick="saveGuestSurvey()" class="submitB" id="submitB">确认</button>
</div>
</div>
</div>
<script src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/autosize.js"></script>
<script type="text/javascript" src="../../js/jquery-1.10.2.js"></script>
<script src="../../js/layer/layer.js"></script>
<script src="../../js/mian.js"></script>
<script>
var qMsg = query()
var priceInfo = null
var dataList = null
var GuestSurveyInfo = null
var texts = [
'非常不满意',
'不满意',
'感觉一般',
'满意',
'非常满意'
]
var STAR_IMG = new Array("../../images/Star1.png", "../../images/Star2.png");
$('.ganxiecydc').html('感谢'+decodeURIComponent(qMsg.SurName)+(qMsg.Sex==1?"先生":"女士")+'参与意见调查')
getPriceInfo()
GetSurveyShowList()
getRadio()
getCheckbox()
GetBusSurveyInfo()
function clickRadio(i) {
const Radiobox = document.getElementById(`my_Radio${i}`);
Radiobox.click()
}
function getRadio() {
dataList.forEach((x,i)=>{
x.SurveyOptionsList.forEach((y,index)=>{
const radios = document.getElementsByName(`my_Radio${i+1}`);
radios.forEach(radio => {
radio.addEventListener('click', function() {
x.ScoreNum = radio.value
// console.log('Selected value:', radio.value);
});
});
})
})
}
function clickCheckbox(i) {
const checkbox = document.getElementById(`my_checkbox${i}`);
checkbox.click()
}
function getCheckbox() {
dataList.forEach((x,i)=>{
x.SurveyOptionsList.forEach((y,index)=>{
const checkbox = document.getElementsByName(`my_checkbox${i+1}`);
checkbox.forEach(checkbox => {
checkbox.addEventListener('click', function() {
if(checkbox.checked) y.IsCheckS.push(checkbox.value)
if(!checkbox.checked) y.IsCheckS = y.IsCheckS.filter(z=>{return z!=checkbox.value})
// console.log(y.IsCheckS,'-----------')
});
});
})
})
}
function getTextarea() {
dataList.forEach((x,i)=>{
var word = document.getElementById(`my_textarea${i+1}`)
if(word&&word.value){
x.TextContent = word.value
}
})
}
function saveGuestSurvey() {
getTextarea()
$('#submitB').attr('disabled', true)
var postMsg = [];
if (dataList && dataList.length > 0) {
dataList.forEach(item => {
item.GuestId = qMsg.GuestId;
item.TCID = qMsg.TCID;
item.OrderID = qMsg.OrderId;
if (item.SurveyType === 2 || item.SurveyType === 3) {
item.SurveyOptionsList.forEach(y => {
//单选
if (item.SurveyType == 2) {
if (item.ScoreNum == y.ID) {
y.IsCheck = "1";
}
}
//多选
if (item.SurveyType == 3) {
y.IsCheck = "0";
if (y.IsCheckS) {
y.IsCheck = "1";
}
}
})
item.ScoreNum = 0;
}
postMsg.push(item);
})
}
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_SetGuestSurvey", postMsg),
async: false,
success: function (res) {
if (res.resultCode === 1) {
layer.msg(res.message)
} else {
layer.msg(res.message)
}
$('#submitB').attr('disabled', false)
},
error: function (message) {
$('#submitB').attr('disabled', false)
alert(JSON.stringify(message));
}
});
}
function GetBusSurveyInfo() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_GetGuestSurveyInfo", {
IsShow: 1,
SurveyType: -1
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
GuestSurveyInfo = res.data
if(GuestSurveyInfo.Title)$('.headerTitle').html(GuestSurveyInfo.Title)
if(GuestSurveyInfo.SubTitle) $('.subscript').html(GuestSurveyInfo.SubTitle)
else{
let parent = document.getElementById("FillincommentsBox");
let child = document.getElementById("subscript");
parent.removeChild(child);
}
}else{
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function GetSurveyShowList() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("survey_post_GetSurveyShowList", {
IsShow: 1,
SurveyType: -1
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
let data = res.data
data.map(item => {
if (item.SurveyType === 2) {
item.SurveyOptionsList.map((cItem, cIndex) => {
cItem.IsCheckS = false
})
}
if (item.SurveyType === 3) {
item.SurveyOptionsList.map((cItem, cIndex) => {
cItem.IsCheckS = []
})
}
if (item.SurveyType === 1) {
item.ScoreNum = 5;
}
})
dataList = data
renderStar()
} else {
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function getPriceInfo() {
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("miniProgram_post_GetBasePrice", {
tcid: this.qMsg.TCID
}),
async: false,
success: function (res) {
if (res.resultCode === 1) {
let data = res.data
priceInfo = data
if(priceInfo&&priceInfo.LeaderName&&priceInfo.LeaderName!='') $('.lindui').html(priceInfo.LeaderName)
if(priceInfo&&priceInfo.GuideName&&priceInfo.GuideName!='') $('.daoyou').html(priceInfo.GuideName)
if(priceInfo&&priceInfo.StartDateStr&&priceInfo.StartDateStr!='') $('.tuanqi1').html(priceInfo.StartDateStr)
if(priceInfo&&priceInfo.EndDateStr&&priceInfo.EndDateStr!='') $('.tuanqi2').html(priceInfo.EndDateStr)
} else {
layer.msg(res.message)
}
},
error: function (message) {
alert(JSON.stringify(message));
}
});
}
function chgStar(num,index){
dataList[index].ScoreNum = num
renderStar()
}
function renderStar(){
// return
var list = []
dataList.forEach((item,i) => {
var str = ''
var mark = ''
var singleChoice = ''
var MultipleChoice = ''
var inputText = ''
var end = `</div>`
var element = document.createElement('div');
str = `<div class="FillincommentsMark">
<div class="FillincommentsMarkT">
<span class="xuhao">${i+1}、</span>
<span class="title">${item.Title}</span>
</div>`
if(item.SurveyType==1) mark = `<div class="FillincommentsMarks">
<span class="text">评 分</span>
<div class="pinfen" id="star${i+1}">
<img id="star_1id_${i+1}point" onmouseover="chgStar(1,${i})"
src="${item.ScoreNum>=1?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_2id_${i+1}point" onmouseover="chgStar(2,${i})"
src="${item.ScoreNum>=2?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_3id_${i+1}point" onmouseover="chgStar(3,${i})"
src="${item.ScoreNum>=3?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_4id_${i+1}point" onmouseover="chgStar(4,${i})"
src="${item.ScoreNum>=4?STAR_IMG[0]:STAR_IMG[1]}"></img>
<img id="star_5id_${i+1}point" onmouseover="chgStar(5,${i})"
src="${item.ScoreNum>=5?STAR_IMG[0]:STAR_IMG[1]}"></img>
</div>
<span class="manyidu">${item.ScoreNum==1?texts[0]:item.ScoreNum==2?texts[1]:item.ScoreNum==3?texts[2]:item.ScoreNum==4?texts[3]:item.ScoreNum==5?texts[4]:''}</span>
</div>`
if(item.SurveyType==2) {
let radioList = []
if(item.SurveyOptionsList.length>0)item.SurveyOptionsList.forEach((radio,index)=>{
radioList.push(`<div><input type="radio" value="${radio.ID}" name="my_Radio${i+1}" id="my_Radio${i+1}${index+1}"/><span onclick="clickRadio(${i+1}${index+1})">${radio.OptionsName}</span></div>`)
})
if(radioList.length>0) singleChoice = `<div class="FillincommentsSingle">
${radioList}
</div>`
}
if(item.SurveyType==3) {
let MultipleList = []
if(item.SurveyOptionsList.length>0)item.SurveyOptionsList.forEach((radio,index)=>{
MultipleList.push(`<div><input type="checkbox" value="${radio.ID}" name="my_checkbox${i+1}" id="my_checkbox${i+1}${index+1}"/><span onclick="clickCheckbox(${i+1}${index+1})">${radio.OptionsName}</span></div>`)
})
if(MultipleList.length>0) MultipleChoice = `<div class="FillincommentsMultiple">
${MultipleList}
</div>`
}
if(item.SurveyType==4) {
inputText = `<div class="FillincommentsDescription">
<textarea rows="8" cols="30" placeholder="点击输入" maxlength="500" id="my_textarea${i+1}" onblur="getTextarea()"></textarea>
</div>`
}
var textHtml = str+mark+singleChoice+MultipleChoice+inputText+end
element.innerHTML = textHtml
list.push(element)
})
$("#app").html(list)
}
</script>
</body>
<style>
.BackBox{
position: fixed;
left: 0px;
top: 0px;
right: 0;
background: #fff;
padding: 20px 20px 10px 20px;
z-index: 2;
}
.BackImg{
width: 10px;
}
.FillincommentsF{
display: flex;
align-items: center;
justify-content: center;
height:100%;
overflow-y: auto;
}
.FillincommentsBox{
width: 90%;
height: 100%;
display: flex;
flex-direction: column;
}
.FillincommentsBox H3{
margin-top: 20px;
}
.FillincommentsIn{
background: #F6F6F6;
border-radius: 5px;
padding: 10px;
margin-top: 10px;
}
.FillincommentsInLD{
display: flex;
flex-direction: row;
justify-content: space-between;
}
.FillincommentsInLD div{
flex: 1;
flex-shrink: 0;
}
.FillincommentsInT{
padding-top: 5px;
}
.FillincommentsMarkB{
display: flex;
flex-direction: column;
flex: 1;
/* overflow: hidden;
overflow-y: auto; */
padding-bottom: 20px;
}
.FillincommentsMark{
display: flex;
flex-direction: column;
margin-top: 15px;
}
.FillincommentsMarkT{
display: flex;
flex-direction: row;
font-size: 15px;
font-weight: 500;
}
.FillincommentsMarks{
font-size: 14px;
font-weight: 500;
margin-top: 5px;
display: flex;
flex-direction: row;
}
.FillincommentsMarks span{
position: relative;
top: 3px;
}
.text{
width: 50px;
flex-shrink: 0;
}
.manyidu{
width: auto;
flex-shrink: 0;
margin-left: 10px;
}
.submitBForm{
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 15px;
}
.submitB{
width: 90%;
border: 0;
height: 40px;
margin-top: 20px;
margin-bottom: 20px;
border-radius: 5px;
background-color: #EE4554;
color: #fff;
}
.pinfen img {
width: 20px;
height: 20px;
display: inline-block;
}
.FillincommentsSingle{
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
margin-top: 5px;
}
.FillincommentsSingle span{
position: relative;
top: 1px;
left: 5px;
}
.FillincommentsSingle div{
display: flex;
flex-direction: row;
align-items: self-start;
justify-content: center;
flex-wrap: nowrap;
margin-right: 20px;
margin-bottom: 5px;
}
.FillincommentsMultiple {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
margin-top: 5px;
}
.FillincommentsMultiple span{
position: relative;
top: 0px;
left: 5px;
}
.FillincommentsMultiple div{
display: flex;
flex-direction: row;
align-items: self-start;
justify-content: center;
flex-wrap: nowrap;
margin-right: 20px;
margin-bottom: 5px;
}
.FillincommentsDescription{
margin-top: 10px;
background: #F6F6F6;
}
.FillincommentsDescription textarea{
width: 100%;
/* height: 150px; */
padding: 5px 10px;
background: #F6F6F6;
border: 1px solid #F6F6F6;
}
.FillincommentsDescription textarea:focus{
border: 1px solid #76c9fa; /* 当textarea获取焦点时的边框色 */
outline: none;
}
.subscript,.ganxiecydc{
/* margin-top: 0;
margin-bottom: 0; */
}
</style>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<meta name="screen-orientation"content="portrait"></meta>
<meta name="x5-orientation"content="portrait"></meta>
<link rel="shortcut icon" href="../../images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../../css/cssReset.css">
<link rel="stylesheet" href="../../css/bts/bootstrap.min.css">
<title>验证</title>
</head>
<body>
<div class="login_content" id="login_content">
<div class="login_button" id="login_button">
<button onclick="changeLoginType(1)">手机号验证</button>
<button onclick="changeLoginType(2)">护照号验证</button>
</div>
</div>
<!-- <div class="login_phone" id="login_phone">
<div class="loginForm">
<div class="loginFormT">
<div><img class="logo" src="../../images/phone.png" alt=""></div>
<input type="phone" class="form-control" id="loginFormT" autocomplete="new-password"
placeholder="请输入手机号码"
onblur="activeFun(1)">
</div>
<button onclick="guestLogin()" class="loginB" id="loginB">确认</button>
<div class="loginBackBox">
<img class="BackImg" onclick="goBack()" src="../../images/login/login_arrowleft.png" />
</div>
</div>
</div> -->
<div class="Passport_phone" id="login_phone">
<div class="PassportForm">
<h3>身份确认</h3>
<input type="phone" class="form-control" id="loginFormT" autocomplete="new-password"
placeholder="请输入手机号码"
onblur="activeFun(1)">
<button onclick="guestLogin()" class="PassportB" id="loginB">确认</button>
<div class="loginBackBox">
<img class="BackImg" onclick="goBack()" src="../../images/login/login_arrowleft.png" />
</div>
</div>
</div>
<div class="Passport_phone" id="Passport_phone">
<div class="PassportForm">
<h3>身份确认</h3>
<input type="phone" class="form-control" id="PassportFormT" autocomplete="new-password"
placeholder="请输入护照号"
onblur="activeFun(2)">
<button onclick="guestLogin()" class="PassportB" id="PassportB">确认</button>
<div class="loginBackBox">
<img class="BackImg" onclick="goBack()" src="../../images/login/login_arrowleft.png" />
</div>
</div>
</div>
<script src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/autosize.js"></script>
<script type="text/javascript" src="../../js/jquery-1.10.2.js"></script>
<script src="../../js/layer/layer.js"></script>
<script src="../../js/mian.js"></script>
<script>
var phoneReg = /^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/
var IsNumEn = /^[a-zA-Z0-9]+$/
var msg = {
type: 0, //1-手机号码验证登录,2-护照号码验证登录
//E75385750 13970261014
guestMobile: "", //1-为手机号码,2-护照号码
TCID: query().TCID
}
$('#login_content').show()
$('#login_phone').hide()
$('#Passport_phone').hide()
function goBack() {
$('#login_content').show()
$('#login_phone').hide()
$('#Passport_phone').hide()
}
function changeLoginType(type){
$('#login_content').hide()
if(type==1) $('#login_phone').show()
if(type==2) $('#Passport_phone').show()
msg.type = type
}
function guestLogin(){
if(msg.type==1){
let phone = $(`#loginFormT`).val()
let obj = $(`#loginB`)
//电话验证
if (!phoneReg.test(phone)) {
obj.attr('disabled', true);
return layer.msg('请输入有效的手机号码!');
}
msg.guestMobile = phone
}
if(msg.type==2){
let Passport = $(`#PassportFormT`).val()
let objPassport = $(`#PassportB`)
//电话验证
if (!phoneReg.test(Passport)) {
objPassport.attr('disabled', true);
return layer.msg('请输入有效的护照号!');
}else {
objPassport.attr('disabled', false);
}
msg.guestMobile = Passport
}
$.ajax({
type: "POST",
url: `${getApiUrl().urlPost}`,
contentType: "application/json",
data: getAjaxData("miniProgram_price_GetGuestByPhone_V2", msg),
async: false,//使用同步的方式,true为异步方式
success: function (res) {
if (res.resultCode === 1) {
var tempData = res.data
var datas = {
TCID: msg.TCID,
GuestId:tempData[0].Id,
SurName: tempData[0].SurName?tempData[0].SurName:'',
Sex:tempData[0].Sex,
OrderId:tempData[0].OrderId,
}
// ?TCID='+datas.TCID+'&GuestId='+datas.GuestId+'&SurName='+datas.SurName+'&Sex='+datas.Sex+'&OrderId='+datas.OrderId+'&phone='+msg.guestMobile
if(msg.type==1) window.location.href='MobileVerification.html?TCID='+datas.TCID+'&GuestId='+datas.GuestId+'&SurName='+datas.SurName+'&Sex='+datas.Sex+'&OrderId='+datas.OrderId+'&phone='+msg.guestMobile
if(msg.type==2) window.location.href='guestSign.html?TCID='+datas.TCID+'&GuestId='+datas.GuestId+'&SurName='+datas.SurName+'&Sex='+datas.Sex+'&OrderId='+datas.OrderId+'&phone='+msg.guestMobile
} else {
layer.msg(res.message)
}
},
error: function (message) {
alert("提交失败" + JSON.stringify(message));
}
});
}
function activeFun(type) {
if(type==1){
let phone = $(`#loginFormT`).val()
let obj = $(`#loginB`)
//电话验证
if (!phoneReg.test(phone)) {
obj.attr('disabled', true);
return layer.msg('请输入有效的手机号码!');
}else {
obj.attr('disabled', false);
}
}
if(type==2){
let Passport = $(`#PassportFormT`).val()
let objPassport = $(`#PassportB`)
//电话验证
if (!phoneReg.test(Passport)) {
objPassport.attr('disabled', true);
return layer.msg('请输入有效的护照号!');
}else {
objPassport.attr('disabled', false);
}
}
}
</script>
</body>
<style>
.login_content{
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.login_button{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 0 10%;
}
.login_button button{
width: 100%;
height: 40px;
margin-bottom: 20px;
border: 0;
background-color: #419EFD;
color: #fff;
border-radius: 5px;
}
.login_button button:last-child{
background-color: #67C239;
}
.login_phone{
padding: 0 10%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.loginForm{
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.loginFormT{
width: 100%;
display: flex;
flex-direction: row;
}
.logo{
width: auto;
margin-right: 15px;
}
.loginB{
margin-top: 20px;
width: 100%;
height: 40px;
border: 0;
background-color: #419EFD;
border-radius: 5px;
color: #fff;
}
.loginForm input{
flex: 1;
/* box-shadow: 0 0 0px rgba(74, 144, 226, 0.5) !important; */
border-bottom: 1px solid #F6F6F6 ;
}
.loginForm input:focus{
border: 1px solid #76c9fa;
outline: none;
}
.loginBackBox{
position: fixed;
left: 0;
top: 0;
right: 0;
background: #fff;
padding: 20px 20px 10px 20px;
z-index: 2;
}
.BackImg{
width: 10px;
}
.Passport_phone{
height: 100%;
overflow: hidden;
padding: 0 10%;
}
.PassportForm{
margin-top: 50px;
display: flex;
flex-direction: column;
}
.PassportForm input{
margin-top: 20px;
}
.PassportForm input:focus{
border: 1px solid #76c9fa;
outline: none;
}
.PassportB{
border: 0;
height: 40px;
margin-top: 20px;
border-radius: 5px;
background-color: #EE4554;
color: #fff;
}
</style>
</html>
\ No newline at end of file
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