表格拖动前：
表格拖动后：
实现代码：
function dragFromLeft(){
/**从左表拖动一条记录到右表*/
$(".group-wish-list-table, .js-table-container").droppable({
drop: function(event, ui)
if (drapingId !== undefined && drapingId !== "" && drapingId !== null) {
if (isAddrow) {
/** 增加一条记录 */
var leftRowObj = $('#left' + drapingId);
if(leftRowObj.length>0){
var rightRowObj = $('#right' + drapingId);
if (rightRowObj.length > 0) {
console.log("exist");
csp.notify('notice', {
msg: '该股票已存在于心愿清单，可进行数量更改或删除操作',
delay: 5000,
});
return ;
} else {
var surBp =$(".js-surplusBp-value").text().split(':')[1];
$scope.surplusBP = $scope.unformat(surBp);
console.log($scope.surplusBP,surBp)
var calRlt = $scope.calCurMarketValue(drapingId, 100,$scope.surplusBP);
var cAmount = $scope.calCurUnitAmount(drapingId, 100);
if (calRlt) {
var stockNum = 0;
var rowObjs = $(leftRowObj).children();
if(cAmount){
stockNum = 100
}else{
stockNum = $(rowObjs[5]).html();
}
var stockTotal = $(rowObjs[5]).html();
var stockNo = $(rowObjs[1]).html();
var stockName = $(rowObjs[2]).html();
var marketVal = $scope.formatNumber(100 * $scope.calStockUnitPrice(stockNo.split('.')[0]),2);
var idStr = "right" + drapingId;
var insertHtmlStr = '<tr class="js-right-row" id="' + idStr + '"><td>' + 0 + '</td><td>'
+ stockNo + '</td><td>' + stockName + '</td><td class="js-amount-right" style="padding-top:1px;padding-bottom:1px;">'
+ '<div class="ui icon input js-stock-num"><input type="text" value="'
+ stockNum + '" style="width:100px;" ><div class="js-num-change"><i class="caret up link icon"></i>'
+ '<i class="caret down link icon"></i></div> <div class="ui label" style="width:40%;color:rgba(39, 35, 35, 0.45);padding-top:14px;">'+stockTotal
+' </div></div></td><td class="js-num-right">'
+ marketVal + '</td>'
+ '<td><i class="trash outline big link icon" data-content="移除"></i>'
+ '</td></tr>';
var tableConObjs = $(this).children();
var tableConObj = tableConObjs[0];
var tableObjs = $(tableConObj).children();
var tableObj = tableObjs[0];
var tbodyObj = tableObjs[1];
var bodyObjs = $(tableObj).next().children();
if (bodyObjs.length > 0) {
$(tbodyObj).append(insertHtmlStr);
} else {
$(tableObj).next().append(insertHtmlStr);
}
$scope.updateCurMaketValue();
} else {
// 弹出对话框提示超过了BP值
//$('.overBP.modal').modal('show');
csp.notify('notice', {
msg: '超出剩余杠杆BP,无法添加进心愿清单',
delay: 5000,
});
}
}
}
}
}
$scope.tableOperator();
$scope.dealRightTableNo();
}
})
}
/**
* @func clearTable
* @desc 清空表格
* @author ll
* @param {string} idStr 想要清空的表格id
*/
$scope.clearTable = function(idStr){
try{
var thistable = document.getElementById(idStr);
var trs = thistable.getElementsByTagName("tr");
for(var i = trs.length - 1; i > 0; i--) {
thistable.deleteRow(i);
}
}catch(e){
}
}
/**
* @func dragLeftTable
* @desc 左表拖动
* @author ll
*/
$scope.dragLeftTable = function(){
//左边表格拖拽操作
$(".js-left-table").draggable({
cursor: "move",
cursorAt: { top: 0, left: 0},
helper: "clone",
start: function() {
var rows = $(this).children();
var stockNo = $(rows[1]).html();
drapingId = stockNo.split('.')[0];
isAddrow = true;
console.log("is-------->isAddrow",isAddrow)
}
});
}
/**
* @func refreshUnitStocks
* @desc 刷新券表界面
* @author ll
*/
$scope.refreshUnitStocks = function(curTrid){
var a = {trid:''};
a.trid = curTrid;
var windowHeight = $(window).height()*0.65;
wishListService.getUnitStocks(a,function(data) {
$scope.clearTable("left-table");
$(".trade-unit-stock-table.container").css("height",windowHeight);
if (data.length >= 0) {
var insertHtmlStr = '';
for (var i = 0; i < data.length; i++) {
var index = i+1
var stockNo = data[i].cid;
var stockName = data[i].cname;
var stockNum = $scope.formatNumber(data[i].totalsa);
var idStr = "left" + data[i].cid.split('.')[0];
var marketVal = $scope.formatNumber(data[i].preclose,2);
var surplusNum = $scope.formatNumber(data[i].totalsa-data[i].allocatedsa);
var surplusVal = $scope.formatNumber((data[i].totalsa-data[i].allocatedsa)*data[i].preclose,2);
if(idStr!=='left000000'){
//ui-widget-content
var tempInsertHtmlStr = '<tr class="js-left-table " id="'
+ idStr + '" style="height:50px;"><td>'+index+'</td><td>' + stockNo + '</td><td>'
+ stockName + '</td><td class="js-num-left">'
+ stockNum + '</td><td class="js-num-left">'
+ marketVal + '</td><td class="js-num-left">'
+ surplusNum + '</td><td class="js-num-left">'
+surplusVal+'</td></tr>';
insertHtmlStr += tempInsertHtmlStr;
}
else{
var tempInsertHtmlStr = '<tr class="js-left-table " style="height:50px;background-color:rgb(230, 32, 32);"><td>'+index+'</td><td>' + stockNo + '</td><td>'
+ stockName + '</td><td class="js-num-left">'
+ stockNum + '</td><td class="js-num-left">'
+ marketVal + '</td><td class="js-num-left">'
+ surplusNum + '</td><td class="js-num-left">'
+surplusVal+'</td></tr>';
insertHtmlStr += tempInsertHtmlStr;
csp.notify('notice', {
msg: '总券表中存在行情不存在的股票，请到交易单元总券表末尾仔细核对是否输入错误',
delay: 15000,
});
}
}
if (insertHtmlStr.length > 0) {
//console.log("getUnitStocks insertHtmlStr--->", insertHtmlStr);
$(".js-left-tbody").append(insertHtmlStr);
//tableOperator();
/** 左边表格拖拽操作 */
$scope.dragLeftTable()
}
}
$(".groupWish-view").removeClass("active");
});
}
/**
* @func formatNumber
* @desc 格式化数字
* @param {number} num 需要被格式化的数字
* @param {int} [precision] 格式化后的精度
* @author lizhexi
*/
$scope.formatNumber = function(num, precision) {
var parts;
// 判断是否为数字
if (!isNaN(parseFloat(num)) && isFinite(num)) {
num = Number(num);
// 处理小数点位数
num = (typeof precision !== 'undefined' ? num.toFixed(precision) : num).toString();
// 分离数字的小数部分和整数部分
parts = num.split('.');
// 整数部分加[separator]分隔, 借用一个著名的正则表达式
parts[0] = parts[0].toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1' + ',');
return parts.join('.');
}
return NaN;
}
/**
* @func unformat
* @desc 将加了千位符的各字符串转换为数字
* @param {String} str 需要被转换为数字的字符串
* @author ll
*/
$scope.unformat = function(str){
var num =str.split(",")
var realnum = +(num.join(''))
return realnum;
}
/**
* @func updateCurMaketValue
* @desc 更新心愿清单总市值
* @author wangxiong
*/
$scope.updateCurMaketValue = function() {
var curTotalVal = 0.0;
var rowObjs = $(".js-right-table").children();
for (var i = 0; i < rowObjs.length; i++) {
var rows = $(rowObjs[i]).children();
var marketValObj = rows[4];
var marketVal = $scope.unformat($(marketValObj).text());
curTotalVal += parseFloat(marketVal);
var cnameObj = rows[2];
var cname=$(cnameObj).text();
}
$scope.marketPrice = curTotalVal.toFixed(2)
var curTotalValStr = "占用BP:" + $scope.formatNumber(curTotalVal,2);
$(".js-market-value").html(curTotalValStr);
}
/**
* @func calStockUnitAmount
* @desc 获取左侧表该股剩余股票数量
* @author lizhexi
*/
$scope.calStockUnitAmount = function(stockNo) {
var leftRowObj = $('#left' + stockNo);
var leftrowObjs = $(leftRowObj).children();
var unitAmount = $scope.unformat($(leftrowObjs[5]).text());
return unitAmount;
}
/**
* @func calCurUnitAmount
* @desc 判断心愿清单某支股票数量是否超过券表中数量
* @author lizhexi
* @param Boolean rlt false-超过不可继续操作 true-未超过可继续操作
*/
$scope.calCurUnitAmount = function(stockNo, stockNum) {
var rlt = false;
var unitAmount = $scope.calStockUnitAmount(stockNo);
if (stockNum >unitAmount) {
rlt = false;
}else{
rlt = true;
}
return rlt;
}
/**
* @func calStockUnitPrice
* @desc 获取左侧表格指定股票单价
* @author wangxiong
*/
$scope.calStockUnitPrice = function(stockNo) {
var leftRowObj = $('#left' + stockNo);
var leftrowObjs = $(leftRowObj).children();
var unitPrice = $scope.unformat($(leftrowObjs[4]).text())
return unitPrice;
}
/**
* @func calCurMarketValue
* @desc 判断心愿清单市值是否超过BP
* @author wangxiong
* @param Boolean rlt false-超过不可继续操作 true-未超过可继续操作
*/
$scope.calCurMarketValue = function(stockNo, stockNum, surplusBp) {
var rlt = false;
var unitPrice = $scope.calStockUnitPrice(stockNo);
var curTotalVal = 0.0;
var rowObjs = $(".js-right-table").children();
for (var i = 0; i < rowObjs.length; i++) {
var rows = $(rowObjs[i]).children();
console.log('rows[1].text()', $(rows[1]).text())
if (stockNo === $(rows[1]).text().split('.')[0]) {
continue;
}
var marketValObj = rows[4];
var marketVal = $scope.unformat($(marketValObj).text());
curTotalVal += parseFloat(marketVal);
}
console.log(curTotalVal,stockNum,unitPrice,surplusBp)
if (curTotalVal + stockNum * unitPrice > surplusBp) {
rlt = false;
}else{
rlt = true;
}
return rlt;
}
/**
* @func dealRightTableNo
* @desc 处理右表编号
* @author wangxiong
*/
$scope.dealRightTableNo = function() {
var rowObjs = $(".js-right-table").children();
for (var i = 0; i < rowObjs.length; i++) {
var rows = $(rowObjs[i]).children();
var rowNo = rows[0];
$(rowNo).text(i + 1);
}
}
/**
* @func delayInputDeal
* @desc 判断输入数量是否是数字。目前未判断是否为整百。可以日后改。
* @author wangxiong
*/
$scope.delayInputDeal = function(data) {
var curNumStr = $(data).val();
var oldValue =$(data).attr("value");
if(/^\d+$/.test(curNumStr)){
/** 判断输入数量是否为正整数 */
var dealNumStr = curNumStr.replace(/\D/g,'');
//console.log("oldVaue-->",oldValue,"dealNumStr-->",dealNumStr);
$(data).val(dealNumStr);
var stockNo = $(data).parent().parent().prev().prev().text();
//console.log("stockNo-->",stockNo)
var tempStr = dealNumStr;
var surBp =$(".js-surplusBp-value").text().split(':')[1];
$scope.surplusBP = $scope.unformat(surBp);
/** 注释掉了整手判断的条件 */
// if (tempStr % 100 == 0) {
var cAmount = $scope.calCurUnitAmount(stockNo.split('.')[0], parseInt(tempStr));
if(cAmount){
var rlt = $scope.calCurMarketValue(stockNo.split('.')[0],parseInt(tempStr),$scope.surplusBP);
if(rlt) {
$(data).attr("value",dealNumStr)
//console.log("cAmount--->",cAmount,"rlt-->",rlt,"替换成功",$(data).attr("value"));
}else{
$(data).val(oldValue);
csp.notify('notice', {
msg: '超出剩余杠杆BP，请重新确认数量',
delay: 5000,
});
console.log("超出剩余杠杆BP_input");
}
}else{
$(data).val(oldValue);
csp.notify('notice', {
msg: '超出券表中该支证券数量,请重新确认数量',
delay: 5000,
});
console.log("超出券表中该支证券数量");
}
// } else {
// //TODO modal
// csp.notify('notice', {
// msg: '请输入以100股为单位的数据',
// delay: 15000,
// });
// $(data).val(oldValue);
// }
var unitPrice = $scope.calStockUnitPrice(stockNo.split('.')[0]);
tempStr = $(data).val();
var curVal = $scope.formatNumber(tempStr * unitPrice,2);
$(data).parent().parent().next().html(curVal);
$scope.updateCurMaketValue();
}else{
$(data).val(oldValue);
csp.notify('notice', {
msg: '请输入正确格式数量',
delay: 5000,
});
}
}
/**
* @func tableOperator
* @desc 操作心愿单
* @author wangxiong
*/
$scope.tableOperator = function() {
$scope.dragLeftTable()
$(".js-right-row").draggable({
cursor: "move",
cursorAt: { top: 0, left: 0 },
helper: "clone",
start: function() {
var rows = $(this).children();
var stockNo = $(rows[1]).html();
drapingId = stockNo.split('.')[0];
isAddrow = false;
}
});
//数量增加100
$(".caret.up.link").unbind("click").click(function() {
var curNumStr = $(this).parent().prev().val();
if (curNumStr == null || curNumStr == undefined || curNumStr == '') {
curNumStr = '0';
}
var stockNo = $(this).parent().parent().parent().prev().prev().html();
var stockInput = $(this).parent().prev().val();
console.log("curNumStr", curNumStr);
console.log("stockNo", stockNo);
console.log("stockInput", stockInput);
var surBp =$(".js-surplusBp-value").text().split(':')[1];
$scope.surplusBP = $scope.unformat(surBp);
console.log('input',$scope.surplusBP,surBp)
var rlt = $scope.calCurMarketValue(stockNo.split('.')[0], parseInt(stockInput) + 100, $scope.surplusBP);
var cAmount=$scope.calCurUnitAmount(stockNo.split('.')[0], parseInt(stockInput) + 100);
if(cAmount){
if (rlt) {
var curNum = 0;
curNum = parseInt(curNumStr) + 100;
$(this).parent().prev().val(curNum);
$(this).parent().prev().attr("value",curNum);
var unitPrice = $scope.calStockUnitPrice(stockNo.split('.')[0]);
var curVal = $scope.formatNumber(curNum * unitPrice,2);
$(this).parent().parent().parent().next().html(curVal);
} else {
//TODO 对话框
csp.notify('notice', {
msg: '超出剩余杠杆BP，请重新确认心愿清单',
delay: 5000,
});
// $('.wish_list_tips').css("display","block");
// $scope.wishListTips = '超出剩余杠杆BP，请重新确认心愿清单'
// $('.wish_list_tips').text($scope.wishListTips)
// setTimeout(function(){
// $scope.wishListTips = '';
// $('.wish_list_tips').css("display","none");
// }, 3000);
//console.log("超出剩余杠杆");
console.log("数量增加失败-->", stockNo);
}
}else{
csp.notify('notice', {
msg: '超出券表中该支证券数量,请重新确认数量',
delay: 5000,
});
// $('.wish_list_tips').css("display","block");
// $scope.wishListTips = '超出券表中该支证券数量,请重新确认数量'
// $('.wish_list_tips').text($scope.wishListTips)
// setTimeout(function(){
// $scope.wishListTips = '';
// $('.wish_list_tips').css("display","none");
// }, 3000);
console.log("超出券表中该支证券数量");
}
$scope.updateCurMaketValue();
});
//数量减少100
$(".caret.down.link").unbind("click").click(function() {
var stockNo = $(this).parent().parent().parent().prev().prev().html();
var curNumStr = $(this).parent().prev().val();
var curNum = 0;
curNum = parseInt(curNumStr) - 100;
if (curNum >=0) {
$(this).parent().prev().val(curNum);
$(this).parent().prev().attr("value",curNum);
var unitPrice = $scope.calStockUnitPrice(stockNo.split('.')[0]);
var curVal = $scope.formatNumber(curNum * unitPrice,2);
$(this).parent().parent().parent().next().html(curVal);
} else if (curNum >= -100) {
$(this).parent().prev().val(0);
$(this).parent().prev().attr("value",0);
$(this).parent().parent().parent().next().html(formatNumber(0,2));
}
$scope.updateCurMaketValue();
});
//防止非法字符
$("input").focus(function(){
var inputObj = this
var $inputObj = $(inputObj)
var oldValue = $inputObj.attr("value")
$inputObj.off("keyup").on("keyup",function(event) {
if(event.keyCode == "13"){
$inputObj.blur();
}
});
$inputObj.unbind("blur").blur(function(){
$scope.delayInputDeal(inputObj);
})
})
//隐藏按钮、显示按钮
$(".input").on("mouseenter mouseleave", function(event) {
var $me = $(this);
if( event.type == "mouseenter"){
$(this).children(".js-num-change").show();
}else if(event.type == "mouseleave" ){
$(this).children(".js-num-change").hide();
}
});
//删除记录
$(".trash, .outline").on("click", function() {
$(this).parent().parent().remove();
$scope.dealRightTableNo();
$scope.updateCurMaketValue();
});
// //右边拖动自行处理
$(".js-right-row").droppable({
accept:".js-right-row ",
drop: function(event, ui) {
if (drapingId !== undefined && drapingId !== "" && drapingId !== null) {
//移动一条记录
var dragRowObj = $('#right' + drapingId);
var htmlStr = $(dragRowObj).html();
var rowObjs = $(dragRowObj).children();
var stockNo = $(rowObjs[1]).html();
var stockName = $(rowObjs[2]).html();
var stockNum1 = $(rowObjs[3]).children();
var stockNum2 = $(stockNum1[0]).children();
var stockNum = $(stockNum2[0]).val();
var marketVal = $(rowObjs[4]).html();
var stockTotal = $(stockNum2[2]).html();
var idStr = "right" + drapingId;
var insertHtmlStr = '<tr class="js-right-row warning" id="' + idStr + '"><td>' + 0 + '</td><td>'
+ stockNo + '</td><td>' + stockName + '</td><td class="js-amount-right" style="padding-top:1px;padding-bottom:1px">'
+ '<div class="ui icon input js-stock-num"><input type="text" value="'
+ stockNum + '" style="width:100px;"><div class="js-num-change"><i class="caret up link icon"></i>'
+ '<i class="caret down link icon"></i></div><div class="ui label" style="width:40%;color:rgba(39, 35, 35, 0.45);padding-top:14px;">'+stockTotal
+' </div></div></td><td class="js-num-right">'
+ marketVal + '</td>'
+ '<td><i class="trash outline big link icon" data-content="移除"></i>'
+ '</td></tr>';
var curRow = this;
var parentObj = $(curRow);
var pId = $(parentObj).attr("id");
console.log("----->", pId);
console.log("--->", 'right' + drapingId);
if (pId == undefined || pId == "" || pId == null || pId === ('right' + drapingId)) {
return ;
} else {
$(curRow).before(insertHtmlStr);
$(dragRowObj).remove();
$('.js-right-row').removeClass("warning");
$('#right' + drapingId).addClass("warning");
// setTimeout(function(){
//
// $('#right' + drapingId).removeClass("warning");
// },4000);
}
$scope.tableOperator();
$scope.dealRightTableNo();
}
}
});
}
/**
* @func saveWishLists
* @desc 保存用户心愿清单数据
* @author
*/
function wishList() {
this.stockIndex = "";
this.stockNo = "";
this.stockName = "";
this.stockNum = "";
this.marketVal = "";
this.stockTotal = "";
}
//获取当前日期
$scope.getNowDate = function() {
var nowdate = new Date();
var year = nowdate.getFullYear();
var month = nowdate.getMonth() + 1;
var day = nowdate.getDate();
var datestr = "";
datestr += year;
if(month < 10) {
datestr += "0";
}
datestr += month;
if(day < 10) {
datestr += "0";
}
datestr += day;
return datestr;
}
扫一扫
1582
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
