<script>
/**
* ???????????????????????????????????????
*/
function getColumnDetail(columnData){
columnData.style.color = "blue";  //??????????????????????
var columnDetail=document.getElementById("columnDetail");  // ????????????????
columnDetail.innerHTML=columnData.innerHTML;    // ???????
}
/**
* ?????????????Ч??
*/
function setOnMounseOverColor(columnData){
columnData.style.background = "red";  //???????????????????
}
function setOnMounseOutColor(columnData){
columnData.style.background = "";
}
/**
* ?????????????????????????json?????????????????????????
*/
function getRowDataDetail(tr){
var jsonData = tr.getAttribute("jsonData"); //????????????json?????
var rowDataDetail = document.getElementById("rowDataDetail");  // ??????????????
rowDataDetail.innerHTML=jsonData;    // ???????
}
/**
* У????????????
*/
function checkDeleteResult(){
var sql = document.getElementById("sql").value;
var ajax = new AjaxUtil();
var path = "<%=path %>/QTPCommonServlet?action=checkDeleteResult";
var paramData = "sql=" + sql;
var settings = {
"datatype":"text"
};
ajax.sendAjax(path??paramData??successBackFunction??errorBackFunction??settings);
function successBackFunction(result){
var deleteResult = document.getElementById("deleteResult");
if(result=='true'){
deleteResult.value = "???";
}else{
deleteResult.value = "???";
}
}
function errorBackFunction(){
alert("У?????????δ???");
}
}
/**
* ?????????
*/
function getAllDatas(){
var sql = document.getElementById("sql").value;
var sqlDateNumber = "0";  //sqlDateNumber????????????????????????????????????????????????????????
var ajax = new AjaxUtil();
var path = "<%=path %>/QTPCommonServlet?action=getAllData";
var paramData = "sql=" + sql +"&sqlDateNumber=" + sqlDateNumber;
var settings = {
"datatype":"text"
};
ajax.sendAjax(path??paramData??successBackFunction??errorBackFunction??settings);
function successBackFunction(result){
createTable(result);
}
function errorBackFunction(){
alert("????????????δ???");
}
}
/**
* ?????????
*/
function createTable(result){
var columnNames;   //??????????????
var columnDatas;   //???????????
var columnNamesDetail = new Array();  //?????????????
var columnData = new Array();         //??????????
var columnDataDetail = new Array();   //?????????????????
var columnJsonData;     //?????????json?????
var _table = document.getElementById("table");
var _row;
var _cell;
var rowNumber = 0;  //??????????????????????ж??????????????
if(result.indexOf("||")!=-1) {
columnNames = result.split("||")[0];
columnNamesDetail = columnNames.split(";");
columnDatas = result.split("||")[1];
columnData = columnDatas.split(";");
}
/**???ж????????????????????????????????*/
if(0!=_table.childNodes.length){
for(var i = _table.childNodes.length-1;i>=0;i--){
_table.removeChild(_table.childNodes[i]); //?????????????????
}
var div = document.getElementById("mydiv");
div.style.height="0px";         //??div????????С
}
/**????????????*/
var totalNumber=document.getElementById("totalNumber");  // ?????????????????
if(columnData==0){
totalNumber.innerHTML="??"+0+"??";
alert('???????в???????????!');
}else{
totalNumber.innerHTML="??"+columnData.length+"??";    // ???????
}
/**??????????*/
_row = document.createElement("tr");
document.getElementById("table").appendChild(_row);
for(var j = 0; j < columnNamesDetail.length; j++) {
_cell = document.createElement("th");
_cell.innerText = columnNamesDetail[j];
_row.appendChild(_cell);
}
/**????????巋??*/
for (var i = 0; i < columnData.length; i++) {
columnJsonData = columnData[i].split("@_@")[1];
columnDataDetail = columnData[i].split("@_@")[0].split("#");
_row = document.createElement("tr");
_row.setAttribute("jsonData"?? columnJsonData);  //?????tr????????jsonData?????????????????json?????
rowNumber++;
_row.onclick= function(){getRowDataDetail(this)};
document.getElementById("table").appendChild(_row);
for(var j = 0; j < columnDataDetail.length; j++) {
_cell = document.createElement("td");
_cell.onclick= function(){getColumnDetail(this)};
_cell.onmouseover = function(){setOnMounseOverColor(this)};
_cell.onmouseout = function(){setOnMounseOutColor(this)};
if(columnDataDetail[j]=='' || columnDataDetail[j]==undefined || columnDataDetail[j]==null){
_cell.innerText = "null";
}else{
_cell.innerText = columnDataDetail[j];
}
_row.appendChild(_cell);
}
}
/**???????????*/
var div = document.getElementById("mydiv");
if(rowNumber>15){  //?????????15?????????div????????????
div.style.height="400px";
}
div.style.width="";
div.style.overflow="scroll";
}
</script>
</head>
<body>
<body>
<h1 align="center">QTP??????</h1>
<p>
<label style="font-size:20px;">?????????</label><br/><hr align="left">
<label style="font-size:17px;">????????QTP?????????棬??????????????????????????????????У??</label><br/>
<label style="font-size:17px;">?????????У???????</label><br/>
<label style="font-size:15px;">(1)??SQL????????????????SQL????磺"select * from t_hyperlink"???????????????????????????????????</label><br/>
<label style="font-size:15px;">(2)???????е??????????????????????????????????????????????????????????????????????????json?????</label><br/>
<label style="font-size:17px;">???У???????</label><br/>
<label style="font-size:15px;">??SQL?????????????????????????SQL???磺"select * from t_hyperlink where short_link='/link100'"?????У???????????</label><br/>
<label style="font-size:15px;">???????????????????????????ж???????????????С?</label><br/><hr align="left">
</p>
<p>
<form action="http://localhost:8080/QTP/QTPCommonServlet" method="post">
<table style="width:;">
<tr>
<td style="width:50%;">
<label style="font-size:20px;width:;" >SQL???壺</label>
</td>
<td style="width:50%;">
<!--
?????????????????
<select name="sqlDateNumber">
<option id="" name="sqlDataNumber" value="">?????</option>
<option id="" name="sqlDataNumber" value="10">????10??</option>
<option id="" name="sqlDataNumber" value="all">??????</option>
</select>
-->
<label style="font-size:16px;width:20%;" align="right" >????????????</label>
<input type="text"   style="width:25%;" id="deleteResult" />
<input type="button" style="width:25%;" value="У?????????" onclick="checkDeleteResult();"/>
<input type="button" style="width:25%;" value="??" style="width: 120px;"  onclick="getAllDatas();" />
</td>
</tr>
<tr>
<td colspan="2">
<textarea id="sql" name="sql" style="width:;" rows = "5"></textarea>
</td>
</tr>
</table>
</form>
</p>
<p>
<label style="font-size:20px;" >?????</label>
<label style="font-size:20px;width:300px;" id="totalNumber">??0??</label> <br/>
<div id="mydiv">
<table border="1">
<tbody id="table">
</tbody>
</table>
</div>
</p>
<p>
<label style="font-size:20px;" >?????????????</label> <br/>
<textarea name="sql" rows = "5" style="width:;" id="columnDetail"></textarea>
</p>
<p>
<label style="font-size:20px;" >???????????</label> <br/>
<textarea name="sql" rows = "5" style="width:;" id="rowDataDetail"></textarea>
</p>
</body>
</html>